/* ===== from event_form.php ===== */  
    .inline {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: .9rem;
    }
    small {
      display: block;
      font-size: .75rem;
      color: #6b7280;
      margin-top: 2px;
    }



    /* final */

/* forms: card style (apply only when needed) */
    .form-card{
      background: #fff;
      padding: 12px 14px;
      border-radius: 14px;
      box-shadow: 0 2px 8px rgba(0,0,0,.08);
      max-width: 520px; /* ←いったん520で統一 */
    }


    /* ===== body baseline (final) ===== */
    /* だいたい16〜20px */
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI",
        "Hiragino Kaku Gothic ProN", "Noto Sans JP",
        "Yu Gothic UI", "Meiryo", sans-serif;

      margin: 16px;
      background: var(--bg, #f6f7f9); /* 変数あれば使う／なければフォールバック */
      color: var(--text, #222);
      line-height: 1.6;

        
      padding-bottom: calc(320px + env(safe-area-inset-bottom));
        
    }


    form {
      margin: 0;
    }


      :root {
    --shadow: 0 3px 14px #0002;
    --radius: 16px;
    --text: #111;
    --muted: #666;
    --bg: #f6f7f9;
    --badge: #00000012;
    --z-top: 9999;

  }


  /* 老眼フレンドリー：clampで自然拡大 */
  html {
    font-size: clamp(16px, 2.8vw, 20px);
  }



  h2 {
    margin: 4px 0 12px;
    font-size: 1.35rem;
  }



  .block {
    background: #fff;
    border-radius: var(--radius);
    margin: 14px 0;
    padding: 12px 14px;
    box-shadow: var(--shadow);
    border-left: 12px solid #ccc;
  }

  
  .time {
    font-size: .85rem;
    color: var(--muted, #666);
    display: flex;
    gap: 8px;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 4px;
  }



  .badge {
    font-size: .75rem;
    padding: 3px 8px;
    border-radius: 999px;
    background: #00000012;
  }

  .badge.reward-rate{
  font-size: 12px;
  opacity: .9;
  background: gold;
}


  .title {
    font-size: 1.05rem;
    font-weight: 800;
    margin: 6px 0 4px;
  }


  .tags {
    margin-top: 4px;
    display: flex;
    flex-wrap: wrap;
    gap: 4px;
  }


  .tag {
    display: inline-block;
    background: #e0f7fa;
    color: #006064;
    font-size: 0.8em;
    padding: 2px 6px;
    border-radius: 8px;
    margin-right: 4px;
  }


    /* 画面幅が狭いときの余白・サイズ微調整 */
  @media (max-width: 420px) {
    .block {
      padding: 12px;
      border-left-width: 10px;
    }

    .title {
      font-size: 1.1rem;
    }

    .time {
      font-size: .9rem;
    }
  }
  

  
    /* ===== form base (event_form / event_edit 共通) ===== */


     .row { margin-bottom: 10px; }
     
    label { font-size: .9rem; font-weight: 600; display:block; margin-bottom:4px;}



    input[type="text"],
    input[type="datetime-local"],
    input[type="date"],
    textarea,
    select {
      width: 100%;
      box-sizing: border-box;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid #d1d5db;
      font-size: .95rem;
    }

    textarea {
      min-height: 80px;
      resize: vertical;
    }


    .btn-row {
      margin-top: 14px;
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
    }


    /* ===== buttons: base ===== */
    .btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 44px;
      padding: 12px 16px;
      border-radius: var(--radius);
      border: 1px solid #0002;
      background: #fff;
      color: var(--text);
      font-weight: 600;
      cursor: pointer;
      text-decoration: none;
    }


/* variants（既存クラス名をそのまま使う＝最小変更） */
  .btn--submit  { background:#22c55e; color:#fff; }
  .btn--delete  { background:#ef4444; color:#fff; }
  .btn--cancel  { background:#e5e7eb; color:#374151; }
  .btn--copy    { background:#60a5fa; color:#fff; }


    h1 {
      font-size: 1.3rem;
      margin-bottom: 12px;
    }