.panel-body {
      width: 100%;
      padding: 20px 25px;
      box-sizing: border-box;
      background-color: #fff;
      border-radius: 6px;
      box-shadow: 1px 1px 10px 1px rgba(0, 0, 0, 0.2);
  }


  /* 容器卡片 */
  .panel-body .frominput {

      padding: 28px;

  }

  .panel-body .row {
      display: flex;
      align-items: center;
      gap: 16px;
      margin-bottom: 22px;
  }

  .panel-body .row .left {
      min-width: 96px;
      font-weight: 600;
      color: #2d3a4a;
      letter-spacing: 0.2px;
  }

  .panel-body .row .right {
      flex: 1;
      display: flex;
      gap: 12px;
      flex-wrap: wrap;
  }

  /* 输入/选择 - 圆角胶囊 */
  .panel-body .intext {
      height: 44px;
      padding: 0 16px;
      border: 1.5px solid #e3e8f0;
      border-radius: 12px;
      background: #f9fbfd;
      color: #1f2937;
      font-size: 14px;
      line-height: 44px;
      transition: all 0.2s ease;
  }

  .panel-body .intext:focus {
      outline: none;
      border-color: #7c5cff;
      background: #fff;
      box-shadow: 0 0 0 4px rgba(124, 92, 255, 0.12);
  }

  .panel-body select.intext {
      width: auto;
      padding-right: 40px;
      background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3e%3cpath d='M6 8l4 4 4-4' stroke='%238A94A6' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3e%3c/svg%3e");
      background-repeat: no-repeat;
      background-position: right 12px center;
      background-size: 16px;
      appearance: none;
      cursor: pointer;
  }

  /* 主按钮 - 胶囊渐变 */
  .panel-body .button {
      height: 44px;
      padding: 0 20px;
      border: 0;
      border-radius: 12px;
      background: linear-gradient(135deg, #7c5cff 0%, #6c8cff 100%);
      color: #fff;
      font-weight: 700;
      letter-spacing: 0.3px;
      box-shadow: 0 8px 18px rgba(108, 140, 255, 0.35);
      transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.2s ease;
  }

  .panel-body .button:hover {
      transform: translateY(-2px);
      box-shadow: 0 12px 26px rgba(108, 140, 255, 0.45);
  }

  /* 操作按钮区 */
  .panel-body .btn {
      display: flex;
      justify-content: center;
      gap: 14px;
      margin-top: 6px;
      flex-wrap: wrap;
  }

  .panel-body .btn1,
  .panel-body .btn2 {
      height: 44px;
      padding: 0 24px;
      border-radius: 999px;
      border: 0;
      color: #fff;
      font-weight: 700;
      letter-spacing: 0.3px;
      transition: transform 0.15s ease, box-shadow 0.2s ease, filter 0.2s ease;
  }

  .panel-body .btn1.corlor_default {
      /* 复制结果 */
      background: linear-gradient(135deg, #10b981 0%, #22c55e 100%);
      box-shadow: 0 8px 18px rgba(34, 197, 94, 0.35);
  }

  .panel-body .btn2.corlor_Info {
      /* 清除 */
      background: linear-gradient(135deg, #f59e0b 0%, #f97316 100%);
      box-shadow: 0 8px 18px rgba(249, 115, 22, 0.35);
  }

  .panel-body .btn1:hover,
  .panel-body .btn2:hover {
      transform: translateY(-2px);
      filter: brightness(1.02);
  }

  /* 结果展示条 */
  .panel-body .result {
      margin-top: 20px;
  }

  .panel-body #out {
      background: linear-gradient(135deg, #ecf2ff 0%, #ffe7ef 100%);
      border: 1px solid #e6ebf5;
      border-radius: 14px;
      padding: 16px 20px;
      color: #1f2a44;
      font-size: 15px;
      box-shadow: 0 6px 18px rgba(28, 39, 60, 0.06);
  }

  .panel-body #out .error {
      color: #e11d48;
      font-weight: 700;
  }

  /* 细节微交互 */
  .panel-body .intext,
  .panel-body .button,
  .panel-body .btn1,
  .panel-body .btn2 {
      will-change: transform, box-shadow, filter;
  }

  /* 响应式 */
  @media (max-width: 768px) {
      .main {
          padding: 0 10px;
      }

      .main .is_title {
          padding: 15px 0;
      }

      .panel-body {
          padding: 15px;
      }

      .panel-body .frominput {
          padding: 18px 14px;
          border-radius: 14px;
      }

      .panel-body .row {
          flex-direction: column;
          align-items: stretch;
          gap: 10px;
          margin-bottom: 16px;
      }

      .panel-body .row .right {
          gap: 10px;
      }

      .panel-body .intext {
          width: 100%;
      }

      .panel-body .button {
          width: auto;
      }

      .mobile-flex-btn {
          width: 100%;
      }
  }

  @media (max-width: 480px) {
      .panel-body .button {
          width: 100%;
      }
  }