.wt-form { max-width: 960px; }
.wt-field { margin-bottom: 16px; }
.wt-label { display:block; font-weight:600; margin-bottom:6px; }
.wt-select, .wt-input { width: 220px; max-width: 100%; }

.wt-fieldset { border:1px solid #ddd; padding:12px 16px; border-radius:8px; }
.wt-legend { font-weight:600; padding:0 6px; }
.wt-radio { display:block; margin:10px 0 6px; }
.wt-radio-inline { margin-right:12px; }

/* 範囲入力行 */
.wt-range-row { display:flex; align-items:center; gap:6px; margin-left:18px; margin-bottom:10px; }
.wt-range-row.is-disabled input,
.wt-range-row.is-disabled select,
.wt-range-row.is-disabled textarea {
  background:#c0c0c0 !important;
  color:#666 !important;
}
.wt-range-row .wt-input[type="number"]{ width: 6.5em; }

/* 出題数まわり */
#wt-count{ width: 80px; }
.wt-count-inline{ display:flex; align-items:center; gap:6px; }
.wt-count-unit{ font-weight:700; }
.wt-field .wt-label{ margin-bottom:2px; }

/* 出題順・出題形式・番号表記・カラム */
.wt-grid { display:grid; grid-template-columns: repeat(4, minmax(140px, 1fr)); gap:12px; }
.wt-grid .wt-radio-inline{ display:block; margin:6px 0; }
.wt-grid > div .wt-radio-inline:first-of-type{ margin-top:2px; }

@media (max-width: 900px){
  .wt-grid{ grid-template-columns: repeat(2, minmax(140px, 1fr)); }
}
@media (max-width: 520px){
  .wt-grid{ grid-template-columns: 1fr; }
}

/* ===== 作成ボタン ===== */
.wt-actions{
  margin-top: 24px;
  text-align: center;
}
.wt-btn-primary{
  appearance: none;
  border: none;
  cursor: pointer;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 280px;
  max-width: 100%;
  padding: 16px 0;

  border-radius: 30px;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .04em;

  color: #fff;
  background: linear-gradient(135deg, #b00000, #e03131);

  box-shadow: 0 5px 11px rgba(0,0,0,.18);
  transition: transform .08s ease,
              box-shadow .18s ease,
              filter .18s ease;
}
.wt-btn-primary:hover{
  filter: brightness(1.04);
  box-shadow: 0 5px 15px rgba(0,0,0,.25);
  transform: translateY(-1px);
}
.wt-btn-primary:active{
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(0,0,0,.18);
}
.wt-btn-primary:focus-visible{
  outline: 3px solid rgba(176,0,0,.25);
  outline-offset: 4px;
}
.wt-btn-primary.is-loading{
  pointer-events: none;
  opacity: .7;
}
@media (max-width: 600px){
  .wt-btn-primary{ width: 100%; }
}

/* 作成ボタン直下〜出力ブロック */
#wt-output{
  margin-top: 24px; /* 作成ボタンと出力の間 */
}

/* ===== 印刷/PDFボタン =====
   ここが②の本命：ボタン“下”に24px（=iframeとの間） */
.wt-print-wrap{
  text-align: center;
  margin-bottom: 24px; /* ← ボタン下余白（プレビューと離す） */
}

/* ===== 印刷/PDFボタン（青） ===== */
.wt-btn-secondary{
  appearance: none;
  border: none;
  cursor: pointer;

  display: inline-flex;
  align-items: center;
  justify-content: center;

  width: 280px;
  max-width: 100%;
  padding: 16px 0;

  border-radius: 30px;
  font-weight: 800;
  font-size: 16px;
  letter-spacing: .04em;

  color: #fff;
  background: linear-gradient(135deg, #1e63d6, #3b82f6);

  box-shadow: 0 5px 11px rgba(0,0,0,.18);
  transition: transform .08s ease,
              box-shadow .18s ease,
              filter .18s ease;
}
.wt-btn-secondary:hover{
  filter: brightness(1.05);
  box-shadow: 0 14px 30px rgba(0,0,0,.25);
  transform: translateY(-1px);
}
.wt-btn-secondary:active{
  transform: translateY(0);
  box-shadow: 0 8px 18px rgba(0,0,0,.18);
}
.wt-btn-secondary:focus-visible{
  outline: 3px solid rgba(59,130,246,.35);
  outline-offset: 4px;
}
@media (max-width: 600px){
  .wt-btn-secondary{ width: 100%; }
}

.wt-noprint{
  margin-bottom: 24px;
}

/* ===== PDF生成完了メッセージ ===== */
.wt-pdf-status {
  margin-top: 16px;
  text-align: left;
}

.wt-pdf-text {
  font-size: 16px;
  line-height: 1.6;
}

.wt-pdf-link {
  margin-top: 10px;
}

.wt-pdf-link a {
  display: inline-block;
  font-size: 18px;      /* ← 少し大きく */
  font-weight: 700;
  padding: 6px 14px;
  border-radius: 6px;
  background: #e9333d;  /* 目立たせる（色は好みで） */
  color: #fff;
  text-decoration: none;
}

.wt-pdf-link a:hover {
  opacity: .85;
}