/* =====================================================================
   style.css — CSS 圧縮（Minify） ツール固有の微調整のみ。
   共通スタイルは /_shared/shirugear.css に任せる（結果表示は sg-result）。
   ===================================================================== */

/* 共有に無い場合の余白ユーティリティ保険 */
.sg-mt-3 { margin-top: var(--sg-space-3, 12px); }

/* コード入出力用の textarea（等幅・折り返さず横スクロール） */
.sg-code {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
  font-size: 0.9rem;
  line-height: 1.6;
  white-space: pre;
  overflow-wrap: normal;
  tab-size: 2;
}
#out-css {
  background: var(--sg-code-bg, #f6f8fc);
}

/* チェックボックス選択肢 */
.sg-check {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  cursor: pointer;
  font-size: 0.95rem;
  line-height: 1.6;
  margin-top: var(--sg-space-1, 6px);
}
.sg-check input[type="checkbox"] {
  margin-top: 3px;
  flex: 0 0 auto;
}
.sg-check code {
  font-size: 0.85em;
}

/* 削減サイズの表示 */
.sg-stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}
@media (max-width: 480px) {
  .sg-stats { grid-template-columns: repeat(2, 1fr); }
}
.sg-stat {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 10px 8px;
  border: 1px solid var(--sg-border, #e2e6ee);
  border-radius: var(--sg-radius, 10px);
  background: var(--sg-code-bg, #f6f8fc);
  text-align: center;
}
.sg-stat__k {
  font-size: 0.78rem;
  color: var(--sg-muted-fg, #667);
}
.sg-stat__v {
  font-size: 1.08rem;
  font-weight: 700;
  font-variant-numeric: tabular-nums;
}
.sg-stat--accent {
  border-color: var(--sg-accent, #3b5bdb);
  background: var(--sg-accent-soft, rgba(59, 91, 219, 0.08));
}
.sg-stat--accent .sg-stat__v {
  color: var(--sg-accent, #3b5bdb);
}

/* 結果アクション（コピー・保存）の横並び */
.sg-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: var(--sg-space-2, 8px);
}
.sg-copy--ghost {
  background: transparent;
  border: 1px solid var(--sg-border, #cfd6e4);
  color: var(--sg-fg, #333);
}

/* 入力エラー表示 */
.sg-err {
  color: var(--sg-danger, #c0392b);
}

/* キーボードキー表示 */
kbd {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.82em;
  padding: 1px 5px;
  border: 1px solid var(--sg-border, #cfd6e4);
  border-bottom-width: 2px;
  border-radius: 5px;
  background: var(--sg-code-bg, #f6f8fc);
}
