/* 回線判別シミュレーター — .ldsim- プレフィックスでWP テーマとの衝突を避ける */
.ldsim-root{
  --ldsim-bg:#ffffff;
  --ldsim-fg:#1f2430;
  /* Xモバイル 用（黄緑） */
  --ldsim-accent:#8df701;
  --ldsim-on-accent:#111827;
  --ldsim-accent-hover:#7ad901;
  --ldsim-accent-press:#68bf00;
  --ldsim-muted:#6b7280;
  --ldsim-panel:#f7f8fa;
  --ldsim-border:#e5e7eb;
  --ldsim-line:#e5e7eb;
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",sans-serif;
  color:var(--ldsim-fg);
  background:var(--ldsim-bg);
  padding:64px 20px 32px;
  max-width:1100px;
  margin:0 auto;
  box-sizing:border-box;
  line-height:1.6;
}
.ldsim-root *,.ldsim-root *::before,.ldsim-root *::after{box-sizing:border-box}

/* ヒーロー: fast.com風の巨大速度表示 */
.ldsim-hero{
  text-align:center;
  padding:48px 20px 40px;
  background:radial-gradient(ellipse at center,#f1ffd9 0%,#ffffff 70%);
  border-radius:16px;
  margin-bottom:32px;
  border:1px solid var(--ldsim-border);
}
.ldsim-hero-copy{max-width:760px;margin:0 auto 24px}
.ldsim-title{margin:0 0 8px;font-size:38px;font-weight:700;line-height:1.25;letter-spacing:-.02em;color:var(--ldsim-fg)}
.ldsim-lead{margin:0;color:var(--ldsim-muted);font-size:15px;line-height:1.8}
.ldsim-mode-panel{
  max-width:860px;
  margin:0 auto 32px;
  padding:20px;
  background:rgba(255,255,255,.86);
  border:1px solid var(--ldsim-border);
  border-radius:14px;
  text-align:left;
}
.ldsim-mobile-panel{display:none}
.ldsim-qr-guide{
  display:grid;
  grid-template-columns:1fr auto;
  gap:20px;
  align-items:center;
  margin-bottom:18px;
}
.ldsim-qr{
  width:112px;
  height:112px;
  padding:8px;
  background:#fff;
  border:1px solid var(--ldsim-border);
  border-radius:10px;
}
.ldsim-form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ldsim-field{display:flex;flex-direction:column;gap:6px;margin:0;font-size:13px;color:var(--ldsim-muted);font-weight:600}
.ldsim-field select,.ldsim-field input{
  width:100%;
  min-height:44px;
  border:1px solid var(--ldsim-border);
  border-radius:10px;
  background:#fff;
  color:var(--ldsim-fg);
  font:inherit;
  font-weight:400;
  padding:10px 12px;
}
.ldsim-field select:focus,.ldsim-field input:focus{outline:2px solid rgba(141,247,1,.38);border-color:var(--ldsim-accent)}
.ldsim-city-field[hidden]{display:none}
.ldsim-speed-wrap{display:flex;justify-content:center;align-items:baseline;gap:12px;margin-bottom:12px}
.ldsim-speed{
  font-size:80px;
  font-weight:200;
  line-height:1;
  color:var(--ldsim-fg);
  font-variant-numeric:tabular-nums;
  letter-spacing:-.04em;
  transition:color .3s;
}
.ldsim-speed.ldsim-active{color:var(--ldsim-accent)}
.ldsim-unit{font-size:18px;color:var(--ldsim-muted);font-weight:300}
.ldsim-status{color:var(--ldsim-muted);font-size:14px;min-height:1.6em;letter-spacing:.05em;margin-bottom:20px}
.ldsim-status.ldsim-wifi{color:var(--ldsim-accent)}
.ldsim-status.ldsim-mobile{color:#ff8a00}
.ldsim-status.ldsim-slow{color:#d83a52}

/* ボタン */
.ldsim-btn{
  appearance:none;
  background:#fff;
  color:var(--ldsim-fg);
  border:1px solid var(--ldsim-border);
  padding:10px 20px;
  border-radius:999px;
  font-size:14px;
  cursor:pointer;
  transition:background .2s,border-color .2s,transform .1s;
  font-family:inherit;
}
.ldsim-btn:hover{background:#f1ffd9;border-color:var(--ldsim-accent)}
.ldsim-btn:active{transform:scale(.97)}
.ldsim-btn:disabled{opacity:.5;cursor:not-allowed}
.ldsim-btn-primary{background:var(--ldsim-accent);color:var(--ldsim-on-accent);border-color:var(--ldsim-accent);font-weight:600;padding:14px 32px;font-size:16px}
.ldsim-btn-primary:hover{background:var(--ldsim-accent-hover);border-color:var(--ldsim-accent-hover);color:var(--ldsim-on-accent)}
.ldsim-btn-primary:active{background:var(--ldsim-accent-press);border-color:var(--ldsim-accent-press);color:var(--ldsim-on-accent)}

/* パネル */
.ldsim-panel{
  background:var(--ldsim-panel);
  border:1px solid var(--ldsim-border);
  border-radius:12px;
  padding:24px;
  margin-bottom:24px;
}
.ldsim-reveal{opacity:0;transform:translateY(8px);max-height:0;overflow:hidden;margin-bottom:0;padding-top:0;padding-bottom:0;border-width:0;transition:opacity .5s ease,transform .5s ease,max-height .5s ease,margin-bottom .5s ease,padding .5s ease,border-width .5s ease}
.ldsim-reveal.ldsim-shown{opacity:1;transform:none;max-height:4000px;margin-bottom:24px;padding-top:24px;padding-bottom:24px;border-width:1px}
.ldsim-panel .ldsim-h2{margin:0 0 16px;font-size:18px;font-weight:600;color:var(--ldsim-fg);line-height:1.3}
.ldsim-note{color:var(--ldsim-muted);font-size:13px;margin:0 0 16px}
.ldsim-extra-panel summary{
  display:grid;
  grid-template-columns:minmax(0,1fr) 10px;
  align-items:center;
  gap:12px;
  cursor:pointer;
  list-style:none;
  font-size:18px;
  font-weight:600;
  color:var(--ldsim-fg);
  line-height:1.3;
}
.ldsim-extra-panel summary::marker{content:""}
.ldsim-extra-panel summary::-webkit-details-marker{display:none}
.ldsim-extra-panel summary::after{
  content:"";
  width:10px;
  height:10px;
  justify-self:end;
  border-right:2px solid var(--ldsim-accent);
  border-bottom:2px solid var(--ldsim-accent);
  transform:rotate(45deg);
  transition:transform .2s ease;
}
.ldsim-extra-panel[open] summary::after{
  transform:rotate(-135deg);
}
.ldsim-extra-panel .ldsim-note{
  margin-top:14px;
}

/* info dl */
.ldsim-info{
  display:grid;
  grid-template-columns:max-content 1fr;
  gap:8px 20px;
  margin:0;
  font-size:14px;
}
.ldsim-info dt{color:var(--ldsim-muted)}
.ldsim-info dd{margin:0;font-variant-numeric:tabular-nums;word-break:break-all;color:var(--ldsim-fg)}
.ldsim-info-mini{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 8px;font-size:11px;max-width:760px;margin:0 auto 20px;padding:0;background:transparent;border:none;grid-template-columns:none}
.ldsim-info-mini dt{display:none}
.ldsim-info-mini dd{display:inline-flex;align-items:center;gap:4px;padding:4px 10px;border-radius:999px;background:rgba(107,114,128,.08);border:1px solid rgba(107,114,128,.2);color:var(--ldsim-muted);white-space:nowrap;max-width:100%;overflow:hidden;text-overflow:ellipsis}
.ldsim-info-mini dd::before{content:attr(data-label);color:var(--ldsim-muted);opacity:.7;font-size:10px;margin-right:2px;flex-shrink:0}
.ldsim-info-mini .ldsim-ua{font-size:10px;white-space:normal;word-break:break-all;max-width:100%;flex-basis:100%;border-radius:8px;text-align:left;line-height:1.5}
/* status 色に連動 */
.ldsim-status.ldsim-wifi ~ .ldsim-info-mini dd{background:rgba(141,247,1,.16);border-color:rgba(104,191,0,.32);color:#4f9200}
.ldsim-status.ldsim-wifi ~ .ldsim-info-mini dd::before{color:rgba(79,146,0,.78)}
.ldsim-status.ldsim-mobile ~ .ldsim-info-mini dd{background:rgba(255,138,0,.1);border-color:rgba(255,138,0,.3);color:#ff8a00}
.ldsim-status.ldsim-mobile ~ .ldsim-info-mini dd::before{color:rgba(255,138,0,.7)}
.ldsim-status.ldsim-slow ~ .ldsim-info-mini dd{background:rgba(216,58,82,.1);border-color:rgba(216,58,82,.3);color:#d83a52}
.ldsim-status.ldsim-slow ~ .ldsim-info-mini dd::before{color:rgba(216,58,82,.7)}
.ldsim-ua{font-size:11px;color:var(--ldsim-muted);font-family:ui-monospace,Menlo,monospace}

/* グリッド */
.ldsim-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.ldsim-card{
  background:#fff;
  border:1px solid var(--ldsim-border);
  border-radius:10px;
  padding:16px;
  text-align:center;
}
.ldsim-card .ldsim-btn{
  width:fit-content;
  min-width:112px;
  margin:0 auto;
}
.ldsim-card .ldsim-h3{margin:0 0 12px;font-size:14px;font-weight:500;color:var(--ldsim-muted);line-height:1.3}
.ldsim-extra-select{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-bottom:12px;
  color:var(--ldsim-muted);
  font-size:12px;
  font-weight:600;
  text-align:left;
}
.ldsim-extra-select select{
  width:100%;
  min-height:42px;
  padding:8px 10px;
  border:1px solid var(--ldsim-border);
  border-radius:10px;
  background:#fff;
  color:var(--ldsim-fg);
  font:inherit;
}
.ldsim-extra-select select:focus{
  outline:2px solid rgba(141,247,1,.38);
  border-color:var(--ldsim-accent);
}
.ldsim-preview{
  width:100%;
  height:180px;
  background:#f1ffd9;
  border-radius:6px;
  margin-bottom:12px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  color:var(--ldsim-muted);
  font-size:12px;
}
.ldsim-preview img,.ldsim-preview video{width:100%;height:100%;object-fit:cover}
.ldsim-preview::before{content:"未読み込み"}
.ldsim-preview:not(:empty)::before{display:none}
.ldsim-time{
  font-size:15px;
  font-weight:700;
  line-height:1.4;
  text-align:center;
  color:var(--ldsim-accent);
  margin-bottom:12px;
  font-variant-numeric:tabular-nums;
}

.ldsim-recommend{
  font-size:15px;
  line-height:1.8;
  margin:0;
  padding:16px;
  background:#fff;
  border-radius:8px;
  border-left:3px solid var(--ldsim-accent);
  color:var(--ldsim-fg);
}
.ldsim-result-head{display:flex;flex-wrap:wrap;align-items:center;gap:10px 12px;margin-bottom:10px}
.ldsim-grade{display:inline-flex;align-items:center;border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700;line-height:1.4}
.ldsim-grade-excellent,.ldsim-grade-fast{background:rgba(141,247,1,.18);color:#4f9200}
.ldsim-grade-normal{background:rgba(255,138,0,.12);color:#c56700}
.ldsim-grade-slow{background:rgba(255,138,0,.18);color:#a94f00}
.ldsim-grade-poor{background:rgba(216,58,82,.12);color:#d83a52}
.ldsim-result-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:10px 0;padding:10px 0;border-top:1px solid var(--ldsim-line);border-bottom:1px solid var(--ldsim-line)}
.ldsim-result-metrics span{display:flex;align-items:baseline;justify-content:center;gap:4px;color:var(--ldsim-muted);font-size:13px;font-weight:700;text-align:center}
.ldsim-result-metrics strong{color:var(--ldsim-fg);font-size:18px;font-weight:800}
.ldsim-result-usage,.ldsim-result-context{margin:0 0 10px}
.ldsim-result-context{color:var(--ldsim-muted);font-size:13px}
.ldsim-average{margin:10px 0;padding:10px 12px;background:rgba(141,247,1,.12);border:1px solid rgba(104,191,0,.26);border-radius:8px}
.ldsim-average-muted{background:rgba(107,114,128,.08);border-color:rgba(107,114,128,.2);color:var(--ldsim-muted)}
.ldsim-result-hints{margin:10px 0 0;padding-left:1.2em}
.ldsim-result-hints li{margin:4px 0}

@media (min-width:445px){
  .ldsim-speed{font-size:18vw}
  .ldsim-unit{font-size:3vw}
}
@media (min-width:934px){
  .ldsim-unit{font-size:28px}
}
@media (min-width:1112px){
  .ldsim-speed{font-size:200px}
}

@media (max-width:767px){
  .ldsim-root{padding:32px 14px 24px}
  .ldsim-hero{padding:32px 14px 30px}
  .ldsim-desktop-panel{display:none}
  .ldsim-mobile-panel{display:block}
  .ldsim-mode-panel{padding:16px;margin-bottom:26px}
  .ldsim-form-grid{grid-template-columns:1fr}
  .ldsim-title{font-size:28px}
  .ldsim-lead{font-size:14px}
  .ldsim-result-metrics{grid-template-columns:1fr}
}