アプリ内課金確認ダイアログ風

<div class="d11-13-05-bg"></div>
        <div class="d11-13-05-dialog">
          <div class="d11-13-05-icon">
            <svg width="28" height="28" viewBox="0 0 24 24" fill="none"><rect x="3" y="3" width="18" height="18" rx="5" fill="#f59e0b"/><path d="M8 12h8M12 8v8" stroke="#fff" stroke-width="2" stroke-linecap="round"/></svg>
          </div>
          <div class="d11-13-05-title">プレミアムプラン(月額)</div>
          <p class="d11-13-05-text">広告非表示・限定コンテンツが利用可能になります</p>
          <div class="d11-13-05-price">¥980<span>/月</span></div>
          <div class="d11-13-05-btns">
            <span class="d11-13-05-btn">キャンセル</span>
            <span class="d11-13-05-btn d11-13-05-btn-strong">購入する</span>
          </div>
        </div>

.d11-13-05-bg{ position:absolute; inset:0; background:#fffbeb; }
        .d11-13-05-dialog{
          position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:250px;
          background:#fff; border-radius:16px; padding:22px 18px 0; text-align:center;
          box-shadow:0 10px 30px rgba(120,53,15,.16);
        }
        .d11-13-05-icon{ margin-bottom:8px; }
        .d11-13-05-title{ font-size:13px; font-weight:800; color:#1f2937; }
        .d11-13-05-text{ margin-top:6px; font-size:10.5px; color:#6b7280; line-height:1.5; }
        .d11-13-05-price{ margin-top:12px; font-size:20px; font-weight:800; color:#b45309; }
        .d11-13-05-price span{ font-size:11px; font-weight:600; color:#9ca3af; }
        .d11-13-05-btns{ display:flex; border-top:1px solid #e5e7eb; margin-top:16px; }
        .d11-13-05-btn{
          flex:1; padding:10px 0; font-size:12px; font-weight:600; color:#6b7280;
          border-right:1px solid #e5e7eb;
        }
        .d11-13-05-btn:last-child{ border-right:none; }
        .d11-13-05-btn-strong{ color:#b45309; font-weight:800; }