@charset "utf-8";
/* ============================================================
   設定判別ツール（sh.php）専用スタイル  slot/tools/sh.css
   ・共通トークン/ヘッダーは /slot/style.css。ここは判別ツール固有の部品。
   ・旧 sh.php のインラインCSS（約1,100行）を外部化・刷新したもの。
     JSが参照するクラス名・ID（.counter-box / .is-collapsed / .sh-fixbar 等）は不変。
   ・「青背景＝回転数から判別する項目」「緑背景＝試行回数とセットで判別する項目」の
     色分けは本文の説明文と対応しているため維持する（色味だけ刷新）。
   ============================================================ */

:root{
  --input-bg:#fff;
  --box-bg:#edf3ff;          /* 青背景マス（回転数で判別） */
  --box-line:#c9d7f4;
  --pairbg:#ecf7f0;          /* 緑背景マス（試行回数とセット） */
  --pairline:#c4e2cf;
  --th-bg:#f3f5f8;
  --th-bg2:#f7f8fa;
  --bar-track:#e9ecf2;
  --shadow:none;
  --collapsed-head-bg:#f4f6fa;
  --error:#b3261e;
  --errorbg:#fdeceb;
  --okbg:#f5f7fb;
}

/* ---------- 基本 ---------- */
html{scroll-behavior:smooth}
body{line-height:1.7}
.wrap{max-width:960px;margin:0 auto;padding:0 12px 24px}
label{display:block;font-weight:800;margin-bottom:6px}
input[type="number"],select{
  width:100%;padding:10px 12px;font-size:16px;
  border:1.5px solid var(--input-border);border-radius:var(--r-btn);
  background:var(--input-bg);color:var(--pk-text);
}
button{
  appearance:none;border:none;background:var(--pk-ink);color:#fff;
  font-size:15px;font-weight:800;padding:12px 18px;border-radius:var(--r-btn);cursor:pointer;
}
button:hover{background:var(--pk-ink-3)}
.help{color:var(--pk-sub);font-size:13px;margin-top:6px}
.note{color:var(--pk-text);font-size:14px}
.small{color:var(--pk-sub);font-size:12.5px}
.card{background:#fff;border:1px solid var(--pk-line);border-radius:var(--r-card);padding:16px 14px;margin:0 0 14px}
.card h3{font-size:16px;margin:0 0 6px}
.sh-h2{
  margin:0 0 4px;font-size:17px;font-weight:800;line-height:1.45;
}
.sh-h2::before{
  content:"";display:block;width:36px;height:4px;margin-bottom:8px;
  background:linear-gradient(90deg,var(--pk-ink) 0 25%,var(--pk-red) 25% 50%,var(--pk-blue) 50% 75%,var(--pk-yellow) 75% 100%);
}
.sh-lead{margin:0 0 6px;font-size:13.5px;color:var(--pk-sub);line-height:1.75}
.sh-anchor{scroll-margin-top:12px}

/* ---------- ヒーロー（データカウンター） ---------- */
.sh-hero{margin:12px 0 0;padding:16px 14px 14px}
.sh-hero-meta{margin:0 0 4px;font-size:12.5px;color:#aeb5c4;font-weight:700;line-height:1.5}
.sh-hero h1{margin:0;font-size:21px;line-height:1.38;font-weight:800;color:#fff;letter-spacing:.01em}
.sh-hero h1 .sh-h1-sub{display:block;margin-top:2px;font-size:14px;color:var(--pk-yellow);font-weight:800;letter-spacing:.04em}
.sh-hero-alias{margin:6px 0 0;font-size:12.5px;color:#c9cfdb}
.sh-hero .led-grid{margin-top:14px}
.sh-hero .led-val{font-size:20px}
.sh-rankcell{display:flex;align-items:center;gap:8px}
.sh-rank{
  flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;
  width:26px;height:26px;border-radius:5px;font-family:var(--pk-dot);font-size:16px;color:#fff;line-height:1;
}
.sh-rankcell{gap:6px}
.sh-rankcell .led-val{font-size:18px;min-width:0}
.sh-rank.r-S{background:var(--rk-s)}.sh-rank.r-A{background:var(--rk-a)}.sh-rank.r-B{background:var(--rk-b)}.sh-rank.r-C{background:var(--rk-c)}
.sh-hero-lead{margin:12px 0 0;font-size:13.5px;line-height:1.75;color:#e4e7ee}
.sh-hero-lead b{color:#fff}
.sh-upd{margin:8px 0 0;font-size:11.5px;color:#8f97a8}
@media (min-width:720px){
  .sh-hero{padding:22px 24px 18px}
  .sh-hero h1{font-size:26px}
}

/* ヒーロー下の操作列：自動保存・バイブ・お気に入り */
.sh-toolbar{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin:10px 0 0}
.autosave-toggle{
  flex:0 0 auto;display:inline-flex;align-items:center;gap:6px;
  min-height:38px;padding:6px 12px;border-radius:var(--r-chip);
  background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-ink);
  font-size:12.5px;font-weight:800;cursor:pointer;white-space:nowrap;line-height:1.2;
}
.autosave-toggle::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--pk-green);box-shadow:0 0 0 2px #d6f0e1}
.autosave-toggle:hover{background:#f6f7fa}
.autosave-toggle.is-off{color:var(--pk-mute);border-color:var(--pk-line);background:#fff}
.autosave-toggle.is-off::before{background:#c3c9d4;box-shadow:none}
.fav-toggle{
  flex:0 0 auto;margin-left:auto;display:inline-flex;align-items:center;justify-content:center;
  min-width:44px;height:38px;padding:0 10px;border-radius:var(--r-chip);
  background:#fff;border:1.5px solid var(--pk-line);
  font-size:20px;line-height:1;color:#b8bfcc;cursor:pointer;
}
.fav-toggle:hover{background:#fff;border-color:var(--pk-ink)}
.fav-toggle.is-fav{color:#e6a700;border-color:#e6a700;background:#fff8d6}

/* ページ内ジャンプ */
.sh-jump{margin:10px -12px 8px}

/* ---------- 設定差テーブル ---------- */
.table{width:100%;border-collapse:collapse;margin-top:10px;font-variant-numeric:tabular-nums}
.table th,.table td{border:1px solid var(--pk-line-soft);padding:9px 8px;text-align:center;font-size:14.5px;line-height:1.45}
.table th{background:var(--th-bg);font-weight:800;font-size:13px;color:var(--pk-text)}
.table th.spec-pair-head{background:var(--pairbg)}
.table td.spec-near{background:#ffe9e7;color:#b3261e;font-weight:800}
.spec-now-row td{background:#e8f6ee;color:var(--pk-green);font-weight:800}
.spec-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;margin-top:10px;border:1px solid var(--pk-line);border-radius:10px}
.spec-scroll .table{margin-top:0;width:max-content;min-width:100%;border-style:hidden}
.spec-scroll .table th,.spec-scroll .table td{white-space:normal;overflow-wrap:anywhere}
.spec-scroll .table th{word-break:break-word}
.spec-scroll .table th.spec-parent-head,.spec-scroll .table th.spec-child-head{background:var(--pairbg)}
.spec-scroll .table tr > :first-child{position:sticky;left:0;z-index:1;background:var(--th-bg);font-weight:800}
.spec-scroll .table tr > td.spec-near:first-child{background:#ffe9e7}
.spec-scroll .table tr.spec-now-row > td:first-child{background:#e8f6ee}

/* 共有ボタン */
.share-tools{display:flex;justify-content:flex-start;gap:6px;flex-wrap:wrap;margin:12px 0 0}
.share-tools a,.share-tools button{
  display:inline-flex;align-items:center;justify-content:center;min-height:38px;
  padding:7px 13px;border-radius:var(--r-chip);border:1.5px solid var(--pk-line);
  color:var(--pk-text);background:#fff;text-decoration:none;font-size:13px;font-weight:800;line-height:1.2;cursor:pointer;
}
.share-tools a:hover,.share-tools button:hover{border-color:var(--pk-ink);background:#fff;text-decoration:none;color:var(--pk-text)}
.share-tools .share-x-btn::before{content:"𝕏";margin-right:5px;font-weight:900}
.share-tools .share-line-btn{border-color:#06c755;color:#04883a}
.share-copy-done{color:var(--pk-green);font-size:13px;font-weight:800;align-self:center}

/* ---------- 判別スコア（旧） ---------- */
.judge-score{margin:4px 0 10px}
.judge-score-main{display:flex;align-items:center;flex-wrap:wrap;gap:8px;line-height:1.4}
.judge-badge{display:inline-block;min-width:26px;padding:2px 7px;border-radius:5px;color:#fff;font-weight:bold;font-size:15px;text-align:center;flex:0 0 auto}
.judge-total{color:var(--rk-s);font-weight:800;font-size:19px}
.judge-breakdown{color:var(--pk-sub);font-size:13px;font-weight:700}
.judge-score-text{color:var(--pk-text);font-size:14px;margin-top:4px;font-weight:700}

/* ---------- 入力フォーム ---------- */
.sh-form-card{padding-top:16px}
.grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:760px){.grid{grid-template-columns:1fr}}
.label-with-dist{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 8px;margin-bottom:6px}
.label-with-dist label{margin-bottom:0}
.business-dist-note{color:var(--pk-sub);font-size:12.5px;font-weight:700;line-height:1.5}
.business-desc-note{color:var(--pk-sub);font-size:12.5px;margin-top:5px;line-height:1.5}
.label-range{font-weight:400;font-size:12.5px;color:var(--pk-sub)}
#ibn{font-weight:800;min-height:48px}
#ibn option{font-size:15px}
#ibn.mode-1{color:#1440ad;border-color:#1a4fd6;background:#f3f6fe}
#ibn.mode-2{color:#0f6b3a;border-color:#1f9d55;background:#effaf3}
#ibn.mode-3{color:#9a5200;border-color:#e08a1e;background:#fff6ea}
#ibn.mode-4{color:#b3261e;border-color:#e0262f;background:#fdf0ef}
#ibn option[value="1"]{color:#1440ad}
#ibn option[value="2"]{color:#0f6b3a}
#ibn option[value="3"]{color:#9a5200}
#ibn option[value="4"]{color:#b3261e;font-weight:700}

.counter-legend{font-size:12px;color:var(--pk-sub);margin:8px 2px 0;line-height:1.65}
.collapse-tools{display:flex;gap:6px;flex-wrap:wrap;margin:14px 0 2px}
.collapse-tools button{
  background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-line);
  padding:7px 12px;font-size:12.5px;font-weight:800;border-radius:var(--r-chip);min-height:36px;
}
.collapse-tools button:hover{border-color:var(--pk-ink);background:#fff}

.counter-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:10px;margin-top:10px}
.counter-grid > *,.counter-box,.counter-inline,.play-inline,.rate-pair-grid,.rate-pair-box{min-width:0}
.counter-box{border:1.5px solid var(--box-line);border-radius:var(--r-card);padding:8px 10px 10px;background:var(--box-bg)}
.rate-box{grid-column:1 / -1}
.counter-box.rate-box{background:var(--pairbg);border-color:var(--pairline)}
.counter-box .counter-head{
  font-weight:800;margin:0 0 8px;display:flex;align-items:center;gap:8px;cursor:pointer;
  user-select:none;-webkit-user-select:none;padding:4px 2px;border-radius:8px;line-height:1.35;font-size:15px;min-height:32px;
}
.counter-box .counter-head:hover{background:rgba(29,33,48,.05)}
.counter-head .head-toggle{flex:0 0 auto;width:18px;height:18px;display:inline-flex;align-items:center;justify-content:center;font-size:11px;color:var(--pk-sub);transition:transform .15s}
.counter-head .head-title{flex:1 1 auto;min-width:0}
.counter-head .head-live{flex:0 0 auto;font-size:12px;font-weight:700;color:var(--pk-sub);white-space:nowrap}
.counter-head .head-live strong{color:var(--pk-text);font-weight:800;font-family:var(--pk-dot);font-size:14px}
.counter-body{margin-top:2px}
.counter-box.is-collapsed{background:var(--collapsed-head-bg);border-color:var(--pk-line);padding-bottom:8px}
.counter-box.is-collapsed .counter-body{display:none}
.counter-box.is-collapsed .counter-head{margin-bottom:0}
.counter-box.is-collapsed .head-toggle{transform:rotate(-90deg)}
.counter-input-col{min-width:0;display:flex;flex-direction:column}

/* 回数カウンター：[-10][-1][入力][+1][+10]＋補助行[0][未使用]（グリッドはver8.21を踏襲） */
.counter-inline{
  display:grid;
  grid-template-columns:minmax(40px,50px) minmax(40px,50px) minmax(72px,96px) minmax(56px,1.55fr) minmax(44px,1fr);
  gap:5px;align-items:stretch;max-width:440px;
}
.counter-inline input,.play-inline input{
  width:100%;text-align:center;min-width:0;
  font-family:var(--pk-dot);font-size:28px;line-height:1.1;color:var(--pk-ink);
  padding:6px 2px;border:2px solid var(--pk-ink);border-radius:var(--r-btn);background:#fff;
}
.play-inline{
  display:grid;
  grid-template-columns:minmax(40px,50px) minmax(40px,50px) minmax(86px,114px) minmax(0,1fr) minmax(0,1fr) minmax(0,1fr);
  gap:5px;align-items:stretch;max-width:440px;
}
.play-inline input{font-size:30px;grid-area:1/3/3/4}
.play-inline .play-actions{display:contents}
.play-inline .counter-btn[data-step="-10"]{grid-area:1/1}
.play-inline .counter-btn[data-step="-1"]{grid-area:1/2}
.play-inline .counter-btn[data-step="1"]{grid-area:1/4/2/7;font-size:18px}
.play-inline .counter-btn[data-step="10"]{grid-area:2/4}
.play-inline .counter-btn[data-step="100"]{grid-area:2/5}
.play-inline .counter-btn[data-step="1000"]{grid-area:2/6}
.play-inline .counter-btn[data-empty="play"]{grid-area:2/1/3/3;padding:5px 0;font-size:12px;letter-spacing:0}
.counter-actions{display:grid;grid-template-columns:0.68fr 0.68fr 1.55fr 1.22fr 0.78fr 0.78fr;gap:5px;margin-top:0;max-width:440px}
.counter-actions .counter-btn.clear{font-size:10.5px;padding:9px 0;line-height:1.2;white-space:nowrap;letter-spacing:-0.4px}
.counter-inline .counter-input-col,.counter-inline .counter-actions{display:contents}
.counter-inline .counter-btn[data-step="-10"]{grid-area:1/1}
.counter-inline .counter-btn[data-step="-1"]{grid-area:1/2}
.counter-inline input{grid-area:1/3/3/4}
.counter-inline .counter-btn[data-step="1"]{grid-area:1/4/3/5;font-size:18px}
.counter-inline .counter-btn[data-step="10"]{grid-area:1/5/3/6}
.counter-inline .counter-btn[data-clear]{grid-area:2/1;padding:5px 0;font-size:12px;letter-spacing:0}
.counter-inline .counter-btn[data-empty]{grid-area:2/2;padding:5px 0;font-size:11px;letter-spacing:-0.4px}
.play-actions{grid-template-columns:0.62fr 0.62fr 1.45fr 1.18fr 1.1fr 1.1fr 0.95fr;gap:4px;max-width:560px}
.play-actions .counter-btn.clear{font-size:10.5px;letter-spacing:-0.5px;padding:11px 0}
.play-actions .counter-btn{font-size:13px;padding:11px 0;letter-spacing:-0.2px;white-space:nowrap}

.counter-btn{
  padding:10px 4px;border-radius:9px;border:none;font-size:15px;font-weight:800;cursor:pointer;line-height:1.15;
  touch-action:manipulation;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;min-height:42px;
}
.counter-btn.plus{background:var(--pk-ink);color:#fff;box-shadow:0 2px 0 #000}
.counter-btn.plus:hover{background:var(--pk-ink-3)}
.counter-btn.plus:active{transform:translateY(1px);box-shadow:0 1px 0 #000}
.counter-btn.minus{background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-line)}
.counter-btn.minus:hover{background:#f6f7fa}
.counter-btn.clear{
  background:#fff;color:#b3261e;padding:6px 6px;font-size:12px;
  border:1px solid #f0c4bf;border-radius:8px;min-height:30px;
}
.counter-btn.clear:hover{background:#fff5f4}

/* 試行回数セット項目 */
.rate-caption{color:var(--pk-sub);font-size:12.5px;margin:-2px 0 8px;line-height:1.6}
.rate-pair-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:8px}
.rate-pair-box{border:none;border-radius:0;background:transparent;padding:0}
.rate-pair-box + .rate-pair-box{border-top:1px dashed var(--pairline);margin-top:11px;padding-top:11px}
.rate-pair-box .pair-title{font-weight:800;margin-bottom:5px;font-size:13.5px}
.rate-pair-box .counter-actions{max-width:none}
@media (min-width:761px){
  .counter-box{container-type:inline-size}
  .play-inline{container-type:inline-size}
  @container (max-width:480px){
    .play-actions{grid-template-columns:repeat(4,1fr)}
    .play-actions .counter-btn.clear{grid-column:span 2}
  }
  .rate-pair-box .counter-actions{grid-template-columns:repeat(4,1fr)}
  .rate-pair-box .counter-actions .counter-btn.clear{grid-column:span 2}
  .rate-pair-grid{gap:16px 12px}
  .rate-pair-box + .rate-pair-box{border-top:none;margin-top:0;padding-top:0}
}

/* ライブ現在値 */
.live-rate{margin:4px 0 0;font-size:12.5px;line-height:1.4;color:var(--pk-sub);font-weight:700;white-space:normal;overflow-wrap:anywhere}
.live-rate strong{color:var(--pk-text);font-weight:800}
.live-rate[data-live-rate-for]{display:none !important}
.live-rate.trial-over,.live-rate.trial-over strong{color:#b3261e}
.live-rate .setting-tag{font-size:inherit}

/* 入力説明（小型） */
.input-description-details{margin-top:8px}
.input-description-details summary{cursor:pointer;list-style:none;padding:4px 2px;font-size:12.5px;font-weight:800;color:var(--pk-blue);display:flex;align-items:center;gap:6px}
.input-description-details summary::-webkit-details-marker{display:none}
.input-description-details summary::after{content:"";margin-left:auto;width:7px;height:7px;border-right:2px solid var(--pk-sub);border-bottom:2px solid var(--pk-sub);transform:rotate(45deg);transition:transform .2s;flex:0 0 auto}
.input-description-details[open] summary::after{transform:rotate(-135deg)}
.input-description-body{padding:4px 4px 6px;color:var(--pk-text);font-size:14px}

/* 値変更フラッシュ（ver8.25） */
.sh-flash-up{--flb:#e2e6f5;--flc:#1d2130;--fls:29,33,48}
.sh-flash-down{--flb:#ffeccf;--flc:#e08a1e;--fls:224,138,30}
.sh-flash-other{--flb:#ffdcd8;--flc:#d33a2c;--fls:211,58,44}
.sh-flash-up,.sh-flash-down,.sh-flash-other{animation:shValueFlash 900ms ease-out}
@keyframes shValueFlash{0%{background-color:var(--flb);border-color:var(--flc);box-shadow:0 0 0 3px rgba(var(--fls),.22),0 0 10px rgba(var(--fls),.18)}}
@media (prefers-reduced-motion: reduce){.sh-flash-up,.sh-flash-down,.sh-flash-other{animation-duration:200ms}}

/* ---------- 下部固定バー・入力履歴・トースト ---------- */
.sh-ops-card{padding:12px}
.sh-bar-slot{height:62px}
.sh-fixbar{
  position:fixed;left:0;right:0;bottom:var(--sh-rb,0px);z-index:80;
  display:flex;align-items:center;gap:6px;
  padding:8px 10px calc(8px + env(safe-area-inset-bottom));
  background:rgba(255,255,255,.97);border-top:1px solid var(--pk-line);
  -webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);box-sizing:border-box;
}
.sh-fixbar.is-parked{position:static;border-top:none;padding:4px 0;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.sh-fixbar button{font-family:inherit;cursor:pointer;border-radius:var(--r-btn);font-weight:800;border:1.5px solid transparent;min-height:48px}
#shUndoBtn{flex:0 0 auto;padding:10px 10px;background:#fff;color:var(--pk-text);border-color:var(--pk-ink);font-size:12.5px;white-space:nowrap}
#shUndoBtn:disabled{opacity:.4;cursor:default}
#shGuessBtn{
  flex:1 1 auto;min-width:0;padding:10px 4px;background:var(--pk-yellow);color:var(--pk-ink);
  font-size:15.5px;display:flex;align-items:center;justify-content:center;gap:6px;white-space:nowrap;overflow:hidden;
  border-color:var(--pk-yellow);box-shadow:0 2px 0 #c9a600;
}
#shGuessBtn:hover{background:var(--pk-yellow-2)}
#shLockBtn{flex:0 0 auto;padding:10px 10px;background:#fff;border-color:var(--pk-line);color:var(--pk-text);font-size:12.5px;white-space:nowrap;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:manipulation}
#shLockBtn.is-on{background:#8a1f1f;border-color:#8a1f1f;color:#fff}
.sh-fixtime:empty{display:none}
.sh-fixtime{flex:0 0 auto;max-width:54px;overflow:hidden;font-size:11px;font-weight:800;color:var(--pk-green);white-space:nowrap;text-align:right}
body.sh-locked #counterForm .counter-btn,body.sh-locked #counterForm input,body.sh-locked .sh-reset-row button,body.sh-locked #shUndoBtn,body.sh-locked #shGuessBtn{pointer-events:none;opacity:.5}
.sh-oplog{margin-bottom:8px;max-height:6.6em;overflow-y:auto;border:1px solid var(--pk-line-soft);border-radius:10px;background:#f8f9fb;padding:6px 10px;font-size:12.5px;line-height:1.85}
.sh-oplog .op{display:flex;gap:8px;border-bottom:1px dashed var(--pk-line-soft);padding:1px 0;align-items:baseline}
.sh-oplog .op:last-child{border-bottom:none}
.sh-oplog .op .t{color:var(--pk-mute);flex:0 0 auto;font-size:11.5px;font-variant-numeric:tabular-nums}
.sh-oplog .op .b{min-width:0;overflow-wrap:anywhere}
.sh-oplog:empty::after{content:'まだ入力履歴がありません。＋−ボタンの操作がここに残ります。';color:var(--pk-mute);font-size:12px}
.sh-hidden-submit{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.tools-row{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.sh-reset-row{display:flex;gap:6px;flex-wrap:nowrap}
.sh-reset-row .sub-btn{flex:1 1 0;min-width:0;padding:11px 0;font-size:13px;letter-spacing:-0.2px;text-align:center}
.sub-btn{background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-line);padding:8px 12px;font-size:13.5px;border-radius:var(--r-btn);min-height:42px}
.sub-btn:hover{background:#f6f7fa}
.sub-btn.danger{background:#fff;color:#b3261e;border:1.5px solid #f0c4bf}
.sub-btn.danger:hover{background:#fff5f4}
.sh-toast{
  position:fixed;left:50%;transform:translateX(-50%);bottom:calc(var(--sh-rb,0px) + 80px);z-index:85;
  background:var(--pk-ink);color:#fff;font-size:13px;font-weight:800;padding:9px 16px;border-radius:var(--r-chip);
  opacity:0;pointer-events:none;transition:opacity .2s;max-width:92%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;box-sizing:border-box;
  box-shadow:0 6px 18px rgba(0,0,0,.25);
}
.sh-toast.on{opacity:1}
.sh-toast.low{bottom:16px}
body{padding-bottom:8px}

/* ---------- エラー ---------- */
.error{background:var(--errorbg);color:var(--error);border:1.5px solid #f0c4bf;border-radius:var(--r-card);padding:12px 14px;margin:0 0 14px;font-weight:700;font-size:14px}
.important-rule{margin:14px 0 0;padding:11px 14px;border:1px solid #f0dc9c;border-radius:var(--r-card);background:#fff9e6;color:#5c4500;font-size:13.5px;font-weight:700}
.new-machine-notice{display:flex;gap:8px;align-items:flex-start;margin:10px 0 14px;padding:11px 14px;border:1px solid #f0dc9c;background:#fff9e6;border-radius:var(--r-card);color:#5c4500;font-size:13.5px;line-height:1.65}
.new-machine-notice .nmn-icon{flex:0 0 auto;font-size:15px;line-height:1.5}

/* ---------- 判別結果 ---------- */
.sh-result{padding:14px}
.sh-res{padding:16px 14px 14px}
.sh-res-lbl{display:block;font-size:12px;font-weight:700;color:#aeb5c4}
.sh-res-main{display:flex;align-items:flex-end;flex-wrap:wrap;gap:4px 14px}
.sh-res-best{font-family:var(--pk-dot);font-size:44px;line-height:1.05;color:var(--pk-yellow);text-shadow:0 0 14px rgba(255,212,0,.35)}
.sh-res-pct{font-family:var(--pk-dot);font-size:26px;line-height:1.1;color:var(--pk-led);text-shadow:0 0 12px rgba(255,74,61,.4)}
.sh-res-pct small{font-family:var(--pk-font);font-size:12px;color:#aeb5c4;margin-right:4px;font-weight:700;text-shadow:none}
.sh-res .led-grid{margin-top:12px}
.sh-res .led-val{font-size:20px}
.sh-res-rel{margin-top:12px;display:flex;align-items:center;gap:10px;font-size:12.5px;color:#c9cfdb;font-weight:700}
.sh-res-rel b{font-family:var(--pk-dot);font-size:18px;font-weight:400;color:#fff}
.sh-res-cells{display:flex;gap:3px;flex:1 1 auto;max-width:220px}
.sh-res-cells i{flex:1 1 0;height:12px;border-radius:2px;background:var(--pk-ink-3)}
.sh-res-cells i.on{background:var(--pk-yellow)}
.sh-res-cells.lv-low i.on{background:#ff8a7a}
.sh-res-cells.lv-mid i.on{background:#ffc94d}
.sh-res-cells.lv-high i.on{background:#5fdc8e}
.sh-res-cmt{margin:8px 0 0;font-size:13px;color:#e4e7ee;line-height:1.6}
.sh-res-note{font-size:11.5px;color:var(--pk-sub);margin:10px 0 0;line-height:1.6}
.sh-cta{margin:12px 0 0}
.summary{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
@media (max-width:760px){.summary{grid-template-columns:1fr 1fr}}
.metric{background:var(--okbg);border:1px solid var(--pk-line);border-radius:var(--r-card);padding:12px}
.metric .label{color:var(--pk-sub);font-size:12.5px;margin-bottom:4px}
.metric .value{font-size:22px;font-weight:800}
.rank-table .best{background:#fff8d6}
.reliability-meter{margin:6px auto 2px;max-width:220px}
.reliability-track{width:100%;height:10px;background:var(--bar-track);border-radius:999px;overflow:hidden}
.reliability-fill{height:10px;border-radius:999px;transition:width .3s}
.reliability-fill.lv-low{background:#e57373}
.reliability-fill.lv-mid{background:#e0a82e}
.reliability-fill.lv-high{background:#31a24c}

/* 設定分布の積み上げ帯 */
.setting-stack{margin:16px 0 4px}
.setting-stack-title{font-size:13px;font-weight:800;color:var(--pk-sub);margin-bottom:6px;text-align:left}
.setting-stack-bar{display:flex;width:100%;height:44px;border-radius:10px;overflow:hidden;border:1px solid var(--pk-line)}
.setting-stack-seg{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;min-width:0;overflow:hidden;white-space:nowrap;line-height:1.15;padding:0 2px}
.setting-stack-seg .seg-text{display:inline-flex;flex-direction:column;align-items:center;background:rgba(29,33,48,.86);color:#fff;border-radius:6px;padding:3px 7px;max-width:100%}
.setting-stack-seg .seg-label{font-size:11.5px;font-weight:800;overflow:hidden;text-overflow:ellipsis;max-width:100%}
.setting-stack-seg .seg-pct{font-size:14px;font-weight:800;font-family:var(--pk-dot)}
.setting-stack-legend{display:flex;flex-wrap:wrap;gap:6px 12px;justify-content:flex-start;margin-top:8px;font-size:12.5px;color:var(--pk-text)}
.setting-stack-legend .legend-item{display:inline-flex;align-items:center;gap:4px}
.setting-stack-legend .legend-dot{width:11px;height:11px;border-radius:3px;display:inline-block}
.setting-stack-seg.setting-tag-gray,.legend-dot.setting-tag-gray{background:#6b7079}
.setting-stack-seg.setting-tag-blue,.legend-dot.setting-tag-blue{background:#1a4fd6}
.setting-stack-seg.setting-tag-cyan,.legend-dot.setting-tag-cyan{background:#017a82}
.setting-stack-seg.setting-tag-green,.legend-dot.setting-tag-green{background:#14834a}
.setting-stack-seg.setting-tag-orange,.legend-dot.setting-tag-orange{background:#c26d00}
.setting-stack-seg.setting-tag-red,.legend-dot.setting-tag-red{background:#c8102e}
.setting-stack-seg.setting-tag-multi,.legend-dot.setting-tag-multi{background:#6f37a3}
.bar-wrap,.projection-bar-wrap{width:100%;background:var(--bar-track);border-radius:999px;overflow:hidden}
.bar-wrap{height:12px}
.bar{height:12px;background:var(--pk-blue)}
.rank-table .best .bar{background:var(--pk-ink)}
.projection-bar-wrap{height:14px}
.projection-bar{height:14px}
.projection-bar.positive{background:#31a24c}
.projection-bar.negative{background:#d9534f}
.projection-table td.positive{color:var(--pk-green);font-weight:800}
.projection-table td.negative{color:#b3261e;font-weight:800}
.observed-table th:first-child,.observed-table td.observed-label-cell{width:35%}
.observed-table td.observed-label-cell{background:var(--th-bg2);font-weight:800;text-align:left;vertical-align:middle;color:var(--pk-text);font-size:13.5px}
.observed-table td.observed-value-cell{text-align:center;vertical-align:middle}
.obs-number{font-weight:800;color:var(--pk-text)}
.obs-sub{color:var(--pk-sub);font-size:13px;margin-left:4px}
.obs-empty{color:var(--pk-mute)}
.obs-trial{margin:0 0 4px}
.obs-item{margin-top:6px;padding-top:5px;border-top:1px dashed var(--pk-line);line-height:1.55}
.obs-item:first-of-type{margin-top:4px}
.obs-bullet{font-weight:800;margin-right:3px;color:var(--pk-sub)}
.obs-label{font-weight:700;color:var(--pk-text)}
.obs-setting-line{margin-top:2px;font-size:13px;color:var(--pk-sub)}
@media (max-width:760px){
  .observed-table th,.observed-table td{font-size:13.5px;padding:8px 6px}
  .obs-sub,.obs-setting-line{font-size:12.5px}
}
/* 設定ラベルの色（判別ツール側） */
.setting-tag{font-weight:800}
.setting-tag-gray{color:#5f6570}
.setting-tag-blue{color:#1a4fd6}
.setting-tag-cyan{color:#017a82}
.setting-tag-green{color:#14834a}
.setting-tag-orange{color:#c26d00}
.setting-tag-red{color:#c8102e}
.setting-tag-multi{color:#6f37a3}
.comment-setting-tag{font-weight:800;white-space:normal;word-break:normal;overflow-wrap:anywhere}
.comment-setting-combo,.high-setting-tag{font-weight:800}

/* 推移グラフ */
.trend-card .trend-chart svg{width:100%;height:auto;display:block}
.trend-legend{display:flex;flex-wrap:wrap;gap:6px 14px;margin:4px 0 8px;font-size:12.5px;color:var(--pk-text)}
.trend-legend-item{display:inline-flex;align-items:center;gap:5px}
.trend-legend-chip{display:inline-block;width:18px;height:3px;border-radius:2px}

/* ---------- 下部固定ミニ結果バー ---------- */
.result-bar{
  position:fixed;left:0;right:0;bottom:0;z-index:60;
  background:var(--pk-ink);color:#fff;
  padding:9px 12px calc(9px + env(safe-area-inset-bottom,0px));
  box-shadow:0 -6px 18px rgba(0,0,0,.25);
  display:none;align-items:center;gap:10px;transform:translateY(100%);transition:transform .2s ease;
}
.result-bar.is-visible{display:flex;transform:translateY(0)}
.result-bar .rb-main{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;line-height:1.25}
.result-bar .rb-label{font-size:11.5px;color:#aeb5c4}
.result-bar .rb-value{font-size:15px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.result-bar .rb-value .rb-pct{color:var(--pk-yellow)}
.result-bar .rb-value .rb-rel{color:#9fc3ff}
.result-bar .rb-jump{flex:0 0 auto;background:var(--pk-yellow);color:var(--pk-ink);border:none;border-radius:8px;padding:9px 13px;font-size:13.5px;font-weight:800;cursor:pointer}
.result-bar .rb-close{flex:0 0 auto;background:transparent;color:#aeb5c4;border:none;font-size:20px;line-height:1;padding:4px 6px;cursor:pointer}
body.has-result-bar{padding-bottom:120px}

/* ---------- アコーディオン（判別ポイント・示唆・天井ほか） ---------- */
.ui-icon{display:block;flex:0 0 auto}
.summary-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:26px;height:26px;border-radius:7px;background:#eef0f5}
.summary-icon-sm{width:auto;height:auto;background:none}
.summary-icon-sm .ui-icon{width:17px;height:17px}
.btn-icon{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;vertical-align:middle}
.comment-details,.usage-details,.history-details,.fav-details{
  margin:0 0 10px;border:1px solid var(--pk-line);border-radius:var(--r-card);background:#fff;
}
.comment-details > summary,.usage-details > summary,.history-details > summary,.fav-details > summary{
  display:flex;align-items:center;gap:10px;cursor:pointer;list-style:none;
  padding:12px 14px;min-height:54px;font-weight:800;font-size:15px;line-height:1.4;
}
.comment-details > summary::-webkit-details-marker,.usage-details > summary::-webkit-details-marker,
.history-details > summary::-webkit-details-marker,.fav-details > summary::-webkit-details-marker{display:none}
.comment-details > summary::after,.usage-details > summary::after,.history-details > summary::after,.fav-details > summary::after{
  content:"";margin-left:auto;width:9px;height:9px;flex:0 0 auto;
  border-right:2px solid var(--pk-sub);border-bottom:2px solid var(--pk-sub);
  transform:rotate(45deg);transition:transform .2s;
}
.comment-details[open] > summary::after,.usage-details[open] > summary::after,
.history-details[open] > summary::after,.fav-details[open] > summary::after{transform:rotate(-135deg)}
.comment-details[open] > summary,.usage-details[open] > summary,.history-details[open] > summary,.fav-details[open] > summary{border-bottom:1px solid var(--pk-line-soft)}
.sum-sub{font-size:12px;font-weight:700;color:var(--pk-sub)}
.comment-details .comment-body{padding:10px 14px 14px;color:var(--pk-text);font-size:14.5px}
.usage-details .usage-body{padding:10px 14px 14px;color:var(--pk-text);font-size:14px}
.usage-details .usage-body p{margin:0 0 8px}
.usage-body .usage-cat{font-weight:800;color:var(--pk-text);font-size:14.5px;margin:16px 0 5px;padding-left:9px;border-left:4px solid var(--pk-ink)}
.usage-body .usage-cat:first-child{margin-top:0}
.history-details .history-body,.fav-details .fav-body{padding:10px 14px 14px}
.pickup-badge{display:inline-block;margin-left:2px;padding:1px 7px;border-radius:var(--r-chip);background:var(--pk-yellow);color:var(--pk-ink);font-weight:800;font-size:11px;letter-spacing:.02em}
.accordion-close-row{margin-top:14px;text-align:center}
.accordion-close-btn{background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-line);padding:9px 24px;font-size:13.5px;font-weight:800;border-radius:var(--r-chip);cursor:pointer;min-height:42px}
.accordion-close-btn:hover{background:#f6f7fa;border-color:var(--pk-ink)}
.comment-text{margin:0 0 10px;line-height:1.75}
.comment-text-line{margin:0 0 3px}
.rich-mini-head{font-weight:800;color:var(--pk-text);margin:10px 0 4px;line-height:1.5}
.power-label{font-weight:800;color:var(--pk-text)}
.power-rank{font-weight:800}
.power-rank-s{color:#c8102e}
.power-rank-a{color:#c26d00}
.power-rank-b{color:#1a4fd6}
.power-rank-c{color:#14834a}
.comment-table-block{margin:12px 0}
.comment-table-title{font-weight:800;margin:0 0 6px;color:var(--pk-text)}
.comment-table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch}
.comment-table{width:auto;min-width:min(100%,520px);max-width:none;border-collapse:collapse;background:#fff}
.comment-table th,.comment-table td{border:1px solid var(--pk-line-soft);padding:8px;text-align:left;font-size:14px;vertical-align:top}
.comment-table th{background:var(--th-bg);font-weight:800}
.comment-table td.comment-key-cell{background:var(--th-bg2);font-weight:700;font-size:13px;color:var(--pk-text);white-space:normal;word-break:normal;overflow-wrap:anywhere}
.comment-table td.comment-check-cell,.comment-table td.comment-value-cell{background:#fff;white-space:normal;word-break:normal;overflow-wrap:anywhere}
.comment-table td.comment-check-cell{cursor:pointer;transition:background-color .15s ease}
.comment-table td.comment-check-cell.is-checked{background:#ffe9e7}
.comment-check-tools{display:flex;justify-content:flex-end;margin:10px 0 0}
.comment-table.comment-table-2col{width:100%;min-width:0;table-layout:fixed}
.comment-table.comment-table-2col th:first-child,.comment-table.comment-table-2col td.comment-key-cell{width:60%}
.comment-table.comment-table-2col th:nth-child(2),.comment-table.comment-table-2col td.comment-check-cell,.comment-table.comment-table-2col td.comment-value-cell{width:40%;min-width:88px}
@media (max-width:760px){
  .comment-table th,.comment-table td{font-size:13px;padding:7px 6px;line-height:1.55}
  .comment-table td.comment-key-cell{font-size:12px}
  .comment-table.comment-table-2col th:first-child,.comment-table.comment-table-2col td.comment-key-cell{width:65%}
  .comment-table.comment-table-2col th:nth-child(2),.comment-table.comment-table-2col td.comment-check-cell,.comment-table.comment-table-2col td.comment-value-cell{width:35%;min-width:88px}
}

/* ゾーン・狙い目 */
.zone-details .comment-body{padding-top:8px}
.zone-group{margin:0 0 14px}
.zone-group:last-child{margin-bottom:0}
.zone-group > .rich-mini-head{margin-top:0;display:flex;align-items:center;gap:6px}
.zone-head-aim::before,.zone-head-cont::before,.zone-head-quit::before{content:"";width:10px;height:10px;border-radius:2px;display:inline-block;flex:0 0 auto}
.zone-head-aim::before{background:#14834a}
.zone-head-cont::before{background:#1a4fd6}
.zone-head-quit::before{background:#c8102e}
.zone-item{border:1px solid var(--pk-line-soft);border-left-width:4px;border-radius:9px;padding:9px 12px;margin:6px 0;background:#fafbfc}
.zone-item-aim{border-left-color:#14834a}
.zone-item-cont{border-left-color:#1a4fd6}
.zone-item-quit{border-left-color:#c8102e}
.zone-item-head{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-bottom:2px}
.zone-range{font-weight:800;color:var(--pk-text);font-size:15px}
.zone-badge{font-weight:800;font-size:11.5px;color:#fff;border-radius:5px;padding:1px 7px;line-height:1.7;flex:0 0 auto}
.zone-badge-strong{background:#c8102e}
.zone-badge-mid{background:#c26d00}
.zone-badge-weak{background:#6b7079}
.zone-cond{font-size:12.5px;color:var(--pk-sub);background:#eef0f5;border-radius:5px;padding:1px 7px}
.zone-basis{line-height:1.75;margin:2px 0;color:var(--pk-text)}
.zone-action{font-size:13.5px;color:var(--pk-ink);font-weight:800;margin-top:3px}
.zone-action::before{content:"▶ ";font-size:.8em}
.ztenjo{margin:0 0 4px}
.ztenjo-row{display:flex;flex-wrap:wrap;align-items:baseline;gap:5px 8px;padding:7px 0;border-bottom:1px dashed var(--pk-line)}
.ztenjo-row:last-child{border-bottom:none}
.ztenjo-label{font-weight:800;color:var(--pk-text);font-size:15px}
.ztenjo-cond{font-size:12.5px;color:var(--pk-sub);background:#eef0f5;border-radius:5px;padding:1px 7px}
.ztenjo-basis{font-size:13.5px;color:var(--pk-text);flex-basis:100%;line-height:1.65}
.ztenjo-sep{border:none;border-top:1px solid var(--pk-line);margin:10px 0 8px}

/* 天井期待値 早見表（sh内） */
.sh-ev h2{margin:0 0 8px;font-size:15px}
.sh-ev h2 small{font-size:12px;font-weight:700;color:var(--pk-sub)}
.sh-ev-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.sh-ev-tbl{border-collapse:collapse;width:100%;font-size:13.5px;text-align:center;font-variant-numeric:tabular-nums}
.sh-ev-tbl th,.sh-ev-tbl td{border:1px solid var(--pk-line-soft);padding:6px 6px;white-space:nowrap}
.sh-ev-tbl th{background:var(--th-bg);font-size:12.5px}
.sh-ev-tbl tr.ev-plus td{background:#e8f6ee;font-weight:800}
.sh-ev-tbl tr.ev-mid td{background:#fff8d6}
.sh-ev-note{font-size:12.5px;color:var(--pk-sub);line-height:1.85;margin-top:8px}

/* 詳細解析値 */
.sh-num-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;padding:12px 14px 14px}
.sh-num-tbl{border-collapse:collapse;width:100%;min-width:560px;font-size:13px;font-variant-numeric:tabular-nums}
.sh-num-tbl th,.sh-num-tbl td{border:1px solid var(--pk-line-soft);padding:7px 6px;text-align:center}
.sh-num-tbl th{background:var(--th-bg)}
.sh-num-tbl th:first-child,.sh-num-tbl td:first-child{text-align:left;font-weight:700}
.sh-num-state{color:#8a5c05}

/* ハマリ確率 */
.hamari-note{margin:6px 2px 10px;font-size:13.5px;color:var(--pk-sub)}
.hamari-item-title{margin:14px 2px 6px;font-weight:800}
.hamari-table td{font-size:13.5px;white-space:nowrap}
.hamari-table td small{color:var(--pk-sub);font-size:11.5px}
.hamari-link{margin:12px 2px 0;font-size:13.5px}
.hamari-ceiling{margin:12px 2px 0;font-size:13.5px;line-height:1.75}
.hamari-ceiling small{color:var(--pk-sub);font-size:12px}

/* 判別のポイント（Q&A） */
.article-qa{font-size:14.5px;color:var(--pk-text)}
.article-qa .qa{padding:16px 0;border-bottom:1px solid var(--pk-line-soft)}
.article-qa .qa:first-child{padding-top:2px}
.article-qa .qa:last-child{border-bottom:none;padding-bottom:2px}
.article-qa .q{display:flex;gap:9px;align-items:flex-start;margin:0 0 10px;font-size:16px;line-height:1.45;font-weight:800;color:var(--pk-text)}
.article-qa .qmark{flex:0 0 auto;background:var(--pk-ink);color:var(--pk-yellow);font-family:var(--pk-dot);font-size:14px;font-weight:400;border-radius:6px;padding:3px 7px;margin-top:1px}
.article-qa .a{font-size:14.5px;color:var(--pk-text);line-height:1.8}
.article-qa .a p{margin:0 0 9px}
.article-qa .a p:last-child{margin-bottom:0}
.article-qa .reach{background:#f4f6fa;border-left:3px solid var(--pk-ink);border-radius:0 8px 8px 0;padding:10px 12px;font-size:14px;margin:0 0 4px;line-height:1.75}
.article-qa .plist{list-style:none;counter-reset:p;margin:6px 0 0;padding:0}
.article-qa .plist>li{counter-increment:p;position:relative;padding:11px 0 11px 36px;border-top:1px solid var(--pk-line-soft)}
.article-qa .plist>li:first-child{border-top:none;padding-top:4px}
.article-qa .plist>li:first-child::before{top:4px}
.article-qa .plist>li::before{content:counter(p);position:absolute;left:0;top:11px;width:26px;height:26px;border-radius:6px;background:var(--pk-ink);color:#fff;font-family:var(--pk-dot);font-size:15px;display:flex;align-items:center;justify-content:center}
.article-qa .pitem{display:flex;align-items:center;gap:8px;margin-bottom:3px;flex-wrap:wrap}
.article-qa .pitem b{font-size:15px}
.article-qa .ptag{font-size:11.5px;font-weight:800;border-radius:5px;padding:2px 7px;color:#fff}
.article-qa .ptag.pS{background:var(--rk-s)}.article-qa .ptag.pA{background:var(--rk-a)}.article-qa .ptag.pB{background:var(--rk-b)}.article-qa .ptag.pC{background:var(--rk-c)}.article-qa .ptag.pX{background:#c3cad4}
.article-qa .plist p{margin:0;font-size:13.5px;color:var(--pk-sub);line-height:1.7}
.article-qa .howbox p{margin:0 0 9px}.article-qa .howbox p:last-child{margin:0}
.article-qa .qa-note{font-size:12.5px;color:var(--pk-mute);margin-top:8px;line-height:1.6}
.article-qa .curve{width:100%;height:auto;display:block;margin:8px 0 4px;background:#fbfcfd;border:1px solid var(--pk-line-soft);border-radius:10px}
.article-qa .curve .ax{font-size:14px;fill:var(--pk-sub)}
.article-qa .curve .glab{font-size:14px;font-weight:700}
.article-qa .curvelegend{display:flex;gap:16px;flex-wrap:wrap;margin:4px 2px 0;font-size:13.5px;color:var(--pk-text);font-weight:700}
.article-qa .curvelg{display:flex;align-items:center;gap:6px}
.article-qa .curvelg i{width:16px;height:5px;border-radius:2px;display:inline-block}
.article-qa .curvecap{font-size:13px;color:var(--pk-sub);margin:6px 2px 0;line-height:1.6}
@media (max-width:600px){
  .article-qa .curve .ax{font-size:23px}
  .article-qa .curve .glab{font-size:21px}
}

/* ---------- 関連ツールへの導線（旧：色違いのボタン群） ---------- */
.sh-tools{margin:0 0 14px;background:#fff;border:1px solid var(--pk-line);border-radius:var(--r-card);overflow:hidden}
.sh-tools a{display:flex;align-items:center;gap:12px;padding:12px 12px 12px 14px;min-height:58px;color:var(--pk-text);border-top:1px solid var(--pk-line-soft)}
.sh-tools a:first-child{border-top:none}
.sh-tools a:hover{background:#f6f7fa;text-decoration:none}
.sh-tools .st-i{flex:0 0 38px;height:38px;border-radius:9px;display:flex;align-items:center;justify-content:center;background:var(--pk-ink);color:#fff}
.sh-tools .st-t{flex:1 1 auto;min-width:0;line-height:1.45}
.sh-tools .st-t b{display:block;font-size:14.5px;font-weight:800}
.sh-tools .st-t small{display:block;font-size:12px;color:var(--pk-sub)}
.sh-tools .st-c{flex:0 0 auto;color:#9aa2b1}

/* 設定推測ゲームの案内 */
.sh-game{margin:0 0 14px;padding:14px;border-radius:var(--r-card);background:#fff;border:1.5px solid var(--pk-ink)}
.sh-game b.sg-t{display:block;font-size:15px;font-weight:800;margin-bottom:4px}
.sh-game p{margin:0 0 10px;font-size:13.5px;line-height:1.8}
.sh-game .sg-stars{color:#c26d00;font-weight:800}

/* ---------- 設定示唆（逆引き） ---------- */
.sh-si-h{font-size:16px;margin:2px 0 6px}
.sh-si-lead{font-size:12.5px;color:var(--pk-sub);margin:2px 0 8px}
.sgf{margin:2px 0 10px}
.sgf input{width:100%;box-sizing:border-box;padding:10px 12px;border:1.5px solid var(--pk-line);border-radius:var(--r-btn);font-size:15px}
.sgf-n{font-size:12.5px;color:var(--pk-sub);display:block;margin-top:4px;min-height:16px}
.sgf-tags{margin-top:6px}
.sgf-tags button{padding:6px 12px;margin:0 6px 6px 0;border:1.5px solid var(--pk-line);border-radius:var(--r-chip);background:#fff;color:var(--pk-text);font-size:12.5px;font-weight:800;cursor:pointer;min-height:34px}
.sgf-tags button:hover{border-color:var(--pk-ink);background:#fff}
.sgf-tags button.on{background:var(--pk-ink);border-color:var(--pk-ink);color:#fff}
.pk-sug-item{margin:12px 0}
.si-ghead{margin:2px 0 8px;padding:9px 12px;border-left:4px solid var(--pk-ink);border-radius:6px;background:#f4f6fa}
.si-ghead .si-gtitle{font-weight:800;font-size:14px;line-height:1.45;color:var(--pk-text)}
.si-ghead .si-gtrig{margin-top:2px;font-size:11.5px;color:var(--pk-sub);line-height:1.65}
.si-power{display:inline-block;min-width:1.6em;text-align:center;padding:1px 6px;margin-right:6px;border-radius:6px;color:#fff;font-size:12px}
.si-row{display:flex;align-items:center;gap:10px;padding:9px 4px;border-bottom:1px dashed var(--pk-line)}
.si-row:last-child{border-bottom:none}
@media (hover:hover){.si-row:hover{background:#f8f9fb;border-radius:8px}}
.si-row.active{background:#fff8d6;border-radius:8px}
.si-ptx{flex:1;min-width:0}
.si-plabel{font-weight:800;font-size:14px}
.si-plabel::before{content:'';display:inline-block;width:9px;height:9px;border-radius:2px;background:#c3c9d4;margin-right:8px;vertical-align:0}
.si-row.active .si-plabel::before{background:var(--pk-yellow);box-shadow:0 0 0 2px #e6c000}
.si-pmean{font-size:12.5px;color:var(--pk-sub);line-height:1.6}
.si-prate{font-size:11.5px;color:var(--pk-green);margin-top:2px;font-variant-numeric:tabular-nums}
.si-ctr{display:flex;align-items:center;gap:5px;flex:0 0 auto}
.si-ctr button{width:40px;height:40px;padding:0;border:1.5px solid var(--pk-line);background:#fff;border-radius:9px;font-size:17px;font-weight:800;cursor:pointer;color:var(--pk-text);-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.si-ctr button[data-d="1"]{background:var(--pk-ink);border-color:var(--pk-ink);color:#fff}
.si-ctr button:active{transform:translateY(1px)}
.si-ctr input{width:48px;height:40px;text-align:center;border:1.5px solid var(--pk-ink);border-radius:9px;font-size:18px;font-family:var(--pk-dot);padding:0}
.si-resbox{border:1px solid var(--pk-line);border-radius:var(--r-card);background:#f8f9fb;padding:12px 14px;margin-top:14px}
.si-reshead{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.si-reshead b{font-size:14.5px}
.si-reshead span{font-size:11.5px;color:var(--pk-sub)}
.si-reshead .sub-btn{margin-left:auto;flex:0 0 auto;padding:8px 14px;min-height:38px}
.si-fine{font-size:11px;color:var(--pk-sub);margin-top:8px;line-height:1.6}
.si-verdict{font-size:15px;font-weight:800;margin:8px 0}
.si-bar{display:flex;align-items:center;gap:8px;margin:7px 0}
.si-bar .sl{width:44px;font-weight:800;font-size:13.5px;text-align:right}
.si-bar .tr{flex:1;background:#e9ecf2;border-radius:4px;height:20px;overflow:hidden}
.si-bar .fl{display:block;height:100%;border-radius:4px;transition:width .35s ease;min-width:2px}
.si-bar.top .sl{text-decoration:underline}
.si-bar .pc{width:62px;font-weight:800;font-size:13.5px;font-variant-numeric:tabular-nums}
.si-warn{background:#fdeceb;border:1px solid #f0c4bf;border-radius:10px;padding:10px 12px;font-size:13.5px;font-weight:800;color:#b3261e;display:none;margin-top:10px}
.si-warn.show{display:block}
.si-memo{background:#fff9e6;border:1px solid #f0dc9c;border-radius:10px;padding:10px 12px;margin-top:12px}
.si-memo .mt{font-weight:800;font-size:13.5px;margin-bottom:6px}
.si-memo .mr{font-size:13px;line-height:1.9;padding:3px 0}
.si-badge{display:inline-block;min-width:56px;text-align:center;color:#fff;border-radius:6px;padding:2px 7px;font-size:11.5px;font-weight:800;margin-right:6px;vertical-align:1px}
.si-minicard{border:1px solid var(--pk-line);border-radius:var(--r-card);background:#fff;padding:12px 14px;margin:0 0 10px}
.si-minihead{display:flex;align-items:center;gap:6px;font-size:14px}
.si-mininote{font-size:11.5px;color:var(--pk-sub);margin-left:auto}
.si-mbar{display:flex;align-items:center;gap:7px;margin:4px 0}
.si-mbar .sl{width:38px;font-weight:800;font-size:12.5px;text-align:right}
.si-mbar .tr{flex:1;background:#e9ecf2;border-radius:4px;height:12px;overflow:hidden}
.si-mbar .fl{display:block;height:100%;border-radius:4px;transition:width .35s ease;min-width:2px}
.si-mbar .pc{width:56px;font-weight:800;font-size:12.5px;font-variant-numeric:tabular-nums}
body.sh-locked #pk-sug .si-ctr button,body.sh-locked #pk-sug .si-ctr input,body.sh-locked #si-reset{pointer-events:none;opacity:.5}

/* ---------- みんなのデータ（tool_log） ---------- */
.tld{margin:0 0 14px;padding:14px;background:#fff;border:1px solid var(--pk-line);border-radius:var(--r-card)}
.tld-h{margin:0 0 10px;font-size:16px;font-weight:800;color:var(--pk-text)}
.tld-h::before{content:"";display:block;width:36px;height:4px;margin-bottom:8px;background:linear-gradient(90deg,var(--pk-ink) 0 25%,var(--pk-red) 25% 50%,var(--pk-blue) 50% 75%,var(--pk-yellow) 75% 100%)}
.tld-h span{margin-left:8px;font-size:11.5px;font-weight:700;color:var(--pk-sub)}
.tld-row{display:flex;align-items:center;gap:8px;margin:6px 0}
.tld-lb{flex:0 0 70px;font-size:12.5px;font-weight:800;color:var(--pk-text);display:flex;align-items:center;gap:5px}
.tld-lb em{font-style:normal;font-size:9.5px;font-weight:800;color:var(--pk-ink);background:var(--pk-yellow);border-radius:6px;padding:1px 5px}
.tld-bar{flex:1 1 auto;height:14px;background:#e9ecf2;border-radius:4px;overflow:hidden}
.tld-bar i{display:block;height:100%;background:var(--pk-ink);border-radius:4px}
.tld-row.my .tld-bar i{background:#e6a700}
.tld-v{flex:0 0 64px;text-align:right;font-size:12.5px;font-weight:800;color:var(--pk-text);font-variant-numeric:tabular-nums}
.tld-v small{color:var(--pk-mute);font-weight:700;margin-left:2px}
.tld-note{margin:10px 0 0;font-size:11.5px;color:var(--pk-sub);line-height:1.7}
.tld-wait .tld-note{font-size:12.5px}
.tld-tabs{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin:0 0 10px}
.tld-tt{font-size:11px;font-weight:800;color:var(--pk-sub);margin-right:2px}
.tld-tt2{margin-left:8px}
.tldt{cursor:pointer;font-size:12px;font-weight:800;padding:5px 11px;border-radius:var(--r-chip);border:1.5px solid var(--pk-line);background:#fff;color:var(--pk-text);min-height:32px}
.tldt:hover{background:#fff;border-color:var(--pk-ink)}
.tldt.on{background:var(--pk-ink);border-color:var(--pk-ink);color:#fff}
.tld-meta{margin:8px 0 0;font-size:12px;color:var(--pk-text);font-weight:700}
.tld-meta b{color:var(--pk-ink);font-family:var(--pk-dot);font-size:15px;font-weight:400}
.tld-empty{font-size:12.5px;color:var(--pk-sub)}
.tls-item{margin:10px 0 12px;border:1px solid var(--pk-line-soft);border-radius:10px;overflow:hidden}
.tls-head{padding:8px 11px;background:#f4f6fa;font-size:12.5px;font-weight:800;color:var(--pk-text)}
.tls-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.tls-wrap table{border-collapse:collapse;width:100%;font-size:12px;background:#fff;font-variant-numeric:tabular-nums}
.tls-wrap th,.tls-wrap td{padding:6px 8px;border-bottom:1px solid #f0f2f6;text-align:center;white-space:nowrap}
.tls-wrap thead th{background:#fafbfc;color:var(--pk-sub);font-weight:800;font-size:11px}
.tls-wrap tr:last-child td{border-bottom:none}
.tls-wrap td.num{font-weight:700;color:var(--pk-text)}
.tls-wrap td.num small{color:var(--pk-green);font-weight:800;margin-left:3px}
.tls-wrap td.dl{text-align:left;font-size:11.5px;color:var(--pk-text)}
.tls-wrap td.dl small{color:#aab3c2}
.tls-wrap td.bb{font-weight:800;color:var(--pk-ink)}
.tls-wrap td.bb small{color:var(--pk-mute);font-weight:700;margin-left:3px}
.tls-wrap tr.chg td{background:#fff8d6}
.tlm-row{margin:11px 0 13px}
.tlm-top{display:flex;align-items:baseline;justify-content:space-between;gap:8px}
.tlm-nm{font-size:13px;font-weight:800;color:var(--pk-text)}
.tlm-val{font-size:12px;color:var(--pk-sub)}
.tlm-val b{font-size:15px;color:var(--pk-ink)}
.tlm-val small{color:var(--pk-mute)}
.tlm-bar{position:relative;height:12px;margin:6px 0 3px;border-radius:4px;background:linear-gradient(90deg,#dfe3ea,#a9bde8 55%,#ffd400)}
.tlm-mk{position:absolute;top:-5px;width:0;height:0;transform:translateX(-50%);border-left:7px solid transparent;border-right:7px solid transparent;border-top:10px solid #c8102e}
.tlm-mk.out{border-top-color:#6f37a3}
.tlm-cap{display:flex;justify-content:space-between;font-size:10.5px;color:var(--pk-mute);font-weight:700}
.tlr-bars{display:flex;align-items:flex-end;gap:8px;height:96px;padding:4px 2px 0}
.tlr-col{flex:1 1 0;display:flex;flex-direction:column;align-items:center;gap:3px;height:100%}
.tlr-n{font-size:11px;font-weight:800;color:var(--pk-ink)}
.tlr-b{flex:1 1 auto;width:100%;max-width:38px;display:flex;align-items:flex-end;background:#e9ecf2;border-radius:4px;overflow:hidden}
.tlr-b i{display:block;width:100%;background:var(--pk-ink)}
.tlr-d{font-size:10.5px;color:var(--pk-mute);font-weight:700}

/* ---------- 推測履歴・お気に入り ---------- */
.history-empty{color:var(--pk-sub);font-size:13.5px}
.history-list{display:flex;flex-direction:column;gap:10px}
.history-item{display:flex;flex-direction:column;gap:8px;border:1px solid var(--pk-line);border-radius:10px;padding:12px;background:#f8f9fb}
.history-meta{min-width:0;line-height:1.4}
.history-meta-line1{font-size:12.5px;font-weight:700;color:var(--pk-sub);margin-bottom:2px}
.history-meta-line2{font-size:14.5px;font-weight:800;color:var(--pk-text)}
.history-buttons{display:flex;gap:6px}
.history-buttons button{flex:1 1 0;min-width:0;padding:9px 4px;font-size:12.5px;font-weight:800;border-radius:8px;text-align:center;white-space:nowrap;cursor:pointer;min-height:40px}
.history-action{background:var(--pk-ink);color:#fff;border:1.5px solid var(--pk-ink)}
.history-action:hover{background:var(--pk-ink-3)}
.history-delete{background:#fff;color:#b3261e;border:1.5px solid #f0c4bf}
.history-delete:hover{background:#fff5f4}
.history-share-x{background:#fff;color:var(--pk-text);border:1.5px solid var(--pk-line)}
.history-share-x:hover{background:#f6f7fa}
.history-share-line{background:#fff;color:#04883a;border:1.5px solid #06c755}
.history-share-line:hover{background:#f2fbf5}
@media (max-width:400px){.history-buttons button{font-size:11.5px;padding:9px 2px}}
.fav-row{display:flex;align-items:center;gap:8px;padding:10px 2px;border-bottom:1px solid var(--pk-line-soft)}
.fav-row:last-child{border-bottom:none}
.fav-badge{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 5px;border-radius:5px;color:#fff;font-family:var(--pk-dot);font-size:14px;flex:0 0 auto;line-height:1}
.fav-name{flex:1 1 auto;min-width:0;color:var(--pk-text);text-decoration:none;font-weight:700;font-size:14.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fav-name:hover{color:var(--pk-blue)}
.fav-tenjo{margin-right:2px}
.fav-tenjo.is-off{color:#b4bac6;background:#f6f7fa;border-color:#e3e6ec;pointer-events:none}
.fav-remove-btn{flex:0 0 auto;background:#fff;border:1.5px solid var(--pk-line);color:var(--pk-sub);border-radius:8px;padding:6px 10px;font-size:12.5px;font-weight:800;cursor:pointer;min-height:36px}
.fav-remove-btn:hover{background:#fff;border-color:var(--pk-ink);color:var(--pk-ink)}
.list-note{color:var(--pk-sub);font-size:12px;margin:8px 0 0}

/* ---------- 関連機種 ---------- */
.related-card{padding:14px}
.related-h{margin:0 2px 10px;font-size:16px;font-weight:800}
.related-h::before{content:"";display:block;width:36px;height:4px;margin-bottom:8px;background:linear-gradient(90deg,var(--pk-ink) 0 25%,var(--pk-red) 25% 50%,var(--pk-blue) 50% 75%,var(--pk-yellow) 75% 100%)}
.related-block{border:1px solid var(--pk-line);border-radius:10px;overflow:hidden;margin-bottom:12px;background:#fff}
.related-block:last-child{margin-bottom:0}
.related-head{display:flex;align-items:center;gap:8px;padding:9px 12px;background:#f6f7fa;font-weight:800;font-size:13.5px}
.related-more{margin-left:auto;font-size:12.5px;font-weight:800;color:var(--pk-blue);text-decoration:none;white-space:nowrap}
.related-row{display:flex;align-items:center;gap:8px;padding:10px 12px;border-top:1px solid var(--pk-line-soft);color:var(--pk-text);text-decoration:none;min-height:48px}
.related-wrap{display:flex;align-items:center;border-top:1px solid var(--pk-line-soft)}
.related-wrap>.related-row{flex:1 1 auto;min-width:0;border-top:none}
.related-tj{margin-right:10px}
.related-row:hover{background:#f6f7fa;text-decoration:none;color:var(--pk-text)}
.related-badge{flex:0 0 auto;min-width:26px;height:26px;display:inline-flex;align-items:center;justify-content:center;padding:0 6px;border-radius:5px;color:#fff;font-family:var(--pk-dot);font-size:15px;line-height:1}
.related-badge.is-none{background:#fff;color:var(--pk-sub);border:1px solid var(--pk-line);font-family:var(--pk-font);font-size:11px;font-weight:700}
.related-name{flex:1 1 auto;font-weight:700;font-size:14.5px;min-width:0}
.related-sub{flex:0 0 auto;color:var(--pk-sub);font-size:12px}

/* ---------- フッター導線 ---------- */
.footer-links{display:grid;grid-template-columns:repeat(2,1fr);gap:6px;margin-top:16px}
.footer-links a{display:flex;align-items:center;justify-content:flex-start;min-height:46px;text-align:left;padding:8px 12px;border:1px solid var(--pk-line);border-radius:var(--r-btn);background:#fff;color:var(--pk-text);text-decoration:none;font-weight:700;font-size:13px;line-height:1.35}
.footer-links a:hover{border-color:var(--pk-ink);background:#fff;text-decoration:none}
.footer-links a.wide{grid-column:1/-1;justify-content:center}
.sh-ad{margin:16px 0 0;min-height:100px}
.sh-copy{text-align:center;padding:16px 10px 18px;margin-top:16px;background:var(--pk-ink);color:#c9cfdb;font-size:12px;border-radius:var(--r-card);letter-spacing:.04em}
.sh-copy::before{content:"";display:block;width:44px;height:4px;margin:0 auto 10px;background:linear-gradient(90deg,#fff 0 25%,var(--pk-red) 25% 50%,var(--pk-blue) 50% 75%,var(--pk-yellow) 75% 100%)}
.sh-copy a{color:#fff}

/* ---------- 示唆ジャンプ（旧 #pkJump は廃止・保険） ---------- */
#pkJump{display:none!important}

@media (max-width:760px){
  .counter-btn{font-size:15px;padding:11px 4px}
  .play-actions .counter-btn,.play-actions .counter-btn.clear{padding:13px 0}
  .rate-pair-grid{grid-template-columns:1fr}
  .counter-actions{gap:5px}
}
@media (max-width:360px){
  .wrap{padding:0 8px 24px}
  .counter-inline input{font-size:24px}
  .play-inline input{font-size:26px}
  #shGuessBtn{font-size:14px}
}

/* 結果カード内の小見出しカード（推移グラフ・期待収支） */
.sh-result .sh-sub-card{border:none;border-top:1px solid var(--pk-line-soft);border-radius:0;padding:16px 0 0;margin:16px 0 0}
.sh-result .sh-sub-card h3{margin:0 0 4px;font-size:15px}
.sh-result .observed-table{margin-top:14px}
.sh-info{margin:16px 0 0}
.sh-info > details:last-child{margin-bottom:14px}