* {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
      font-family: 'Segoe UI', 'Microsoft YaHei', sans-serif;
    }

    body {
      background: linear-gradient(135deg, #f8fafc 0%, #e2e8f0 100%);
      color: #334155;
      line-height: 1.6;
      min-height: 100vh;
      padding: 20px;
    }

    .container {
      max-width: 1200px;
      margin: 0 auto;
      background: white;
      border-radius: 20px;
      box-shadow: 0 15px 35px rgba(0, 0, 0, 0.08);
      overflow: hidden;
      border: 1px solid rgba(99, 102, 241, 0.1);
    }

    .header {
      background: linear-gradient(135deg, #8b5cf6, #3b82f6);
      color: white;
      padding: 60px 40px;
      text-align: center;
      position: relative;
      overflow: hidden;
    }

    .header::before {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      bottom: 0;
      background: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iNjAiIGhlaWdodD0iNjAiIHZpZXdCb3g9IjAgMCA2MCA2MCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj48ZyBmaWxsPSJub25lIiBmaWxsLXJ1bGU9ImV2ZW5vZGQiPjxnIGZpbGw9IiNmZmYiIGZpbGwtb3BhY2l0eT0iMC4xIj48cGF0aCBkPSJNMzYgMzQuNWMwIC44MjgtLjY3MiAxLjUtMS41IDEuNWgtOWMtLjgyOCAwLTEuNS0uNjcyLTEuNS0xLjV2LTljMC0uODI4LjY3Mi0xLjUgMS41LTEuNWg5Yy44MjggMCAxLjUuNjcyIDEuNSAxLjV2OVpNMzQuNSAzM2gtN3Y3aDd2LTdaTTM2IDQuNWMwIC44MjgtLjY3MiAxLjUtMS41IDEuNWgtOWMtLjgyOCAwLTEuNS0uNjcyLTEuNS0xLjV2LTljMC0uODI4LjY3Mi0xLjUgMS41LTEuNWg5Yy44MjggMCAxLjUuNjcyIDEuNSAxLjV2OVpNMzQuNSAzSC0xdjdoMzUuNXYtN1pNMjIuNSAyMWgtOWMtLjgyOCAwLTEuNS0uNjcyLTEuNS0xLjV2LTljMC0uODI4LjY3Mi0xLjUgMS41LTEuNWg5Yy44MjggMCAxLjUuNjcyIDEuNSAxLjV2OWMwIC44MjgtLjY3MiAxLjUtMS41IDEuNVpNMjEgMTAuNWgtN3Y3aDd2LTdaIi8+PC9nPjwvZz48L3N2Zz4=');
      opacity: 0.1;
    }

    .logo {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 15px;
      margin-bottom: 20px;
      flex-wrap: wrap;
    }

    .logo i,
    .logo .legal-symbol {
      font-size: 2.5rem;
      animation: pulse 2s infinite;
    }

    @keyframes pulse {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.1); }
    }

    .logo-text {
      text-align: center;
    }

    .logo-text h1 {
      font-size: 2.2rem;
      font-weight: 800;
      text-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
      margin-bottom: 5px;
    }

    .logo-text .company-en {
      font-size: 1.5rem;
      font-weight: 500;
      opacity: 0.85;
      letter-spacing: 0.5px;
      text-shadow: 0 1px 5px rgba(0, 0, 0, 0.15);
    }

   .company-en {
     font-size: 1rem;
     font-weight: 500;
     opacity: 0.85;
     margin-top: 5px;
   }
    .header h2 {
      font-size: 2.5rem;
      margin-bottom: 15px;
      font-weight: 700;
    }

    .header p {
      font-size: 1.2rem;
      opacity: 0.9;
      max-width: 800px;
      margin: 0 auto;
    }

    .version-date {
      margin-top: 15px;
      font-size: 1.1rem;
      font-weight: 600;
      color: #fbbf24;
      text-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    }

    .content {
      padding: 50px 40px;
    }

    .section {
      margin-bottom: 40px;
      padding-bottom: 30px;
      border-bottom: 1px solid #e2e8f0;
    }

    .section:last-child {
      border-bottom: none;
      margin-bottom: 0;
      padding-bottom: 0;
    }

    .section-title {
      color: #8b5cf6;
      font-size: 1.8rem;
      margin-bottom: 20px;
      padding-bottom: 10px;
      border-bottom: 2px solid #8b5cf6;
      position: relative;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .section-title::after {
      content: '';
      position: absolute;
      bottom: -2px;
      left: 0;
      width: 60px;
      height: 2px;
      background: linear-gradient(to right, #8b5cf6, transparent);
    }

    .section-title i {
      font-size: 1.5rem;
    }

    .section-content {
      color: #475569;
      line-height: 1.8;
    }

    .section-content p {
      margin-bottom: 15px;
      text-align: justify;
    }

    .section-content ul, .section-content ol {
      margin: 15px 0 15px 30px;
    }

    .section-content li {
      margin-bottom: 10px;
      position: relative;
    }

    .highlight {
      background: linear-gradient(135deg, rgba(99, 102, 241, 0.05), rgba(139, 92, 246, 0.05));
      padding: 20px;
      border-radius: 10px;
      margin: 20px 0;
      border-left: 3px solid #8b5cf6;
    }

    .contact-box {
      background: linear-gradient(135deg, #f8fafc, #e2e8f0);
      border-radius: 15px;
      padding: 30px;
      text-align: center;
      margin-top: 40px;
      border: 1px solid rgba(99, 102, 241, 0.2);
    }

    .contact-box h3 {
      color: #334155;
      margin-bottom: 15px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
    }

    .contact-box .email {
      color: #3b82f6;
      font-size: 1.3rem;
      font-weight: 600;
      text-decoration: none;
      display: inline-block;
      padding: 10px 20px;
      background: white;
      border-radius: 25px;
      margin-top: 10px;
      border: 1px solid rgba(99, 102, 241, 0.2);
      transition: all 0.3s ease;
    }

    .contact-box .email:hover {
      transform: translateY(-3px);
      box-shadow: 0 10px 20px rgba(99, 102, 241, 0.1);
      color: #8b5cf6;
    }

    .footer {
      background: #1e293b;
      color: #cbd5e1;
      padding: 40px;
      text-align: center;
      margin-top: 40px;
    }

    .footer-content {
      max-width: 800px;
      margin: 0 auto;
    }

    .footer h3 {
      margin-bottom: 5px;
    }

    .footer-company-en {
      font-size: 0.9rem;
      opacity: 0.7;
      margin-bottom: 10px;
      letter-spacing: 0.5px;
    }

    .update-date {
      color: #fbbf24;
      font-weight: 600;
      margin-top: 20px;
      font-size: 1.1rem;
    }

    .back-btn {
      position: fixed;
      bottom: 30px;
      right: 30px;
      background: linear-gradient(135deg, #8b5cf6, #3b82f6);
      color: white;
      width: 60px;
      height: 60px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.5rem;
      text-decoration: none;
      box-shadow: 0 10px 25px rgba(99, 102, 241, 0.3);
      transition: all 0.3s ease;
      z-index: 100;
    }

    .back-btn:hover {
      transform: translateY(-5px) scale(1.1);
      box-shadow: 0 15px 30px rgba(99, 102, 241, 0.4);
    }

    /* 響應式設計 */
    @media (max-width: 768px) {
      body {
        padding: 10px;
      }

      .header {
        padding: 40px 20px;
      }

      .header h2 {
        font-size: 2rem;
      }

      .logo-text h1 {
        font-size: 1.8rem;
      }

      .content {
        padding: 30px 20px;
      }

      .section-title {
        font-size: 1.5rem;
      }

      .footer {
        padding: 30px 20px;
      }

      .back-btn {
        bottom: 20px;
        right: 20px;
        width: 50px;
        height: 50px;
        font-size: 1.2rem;
      }
    }

    @media (max-width: 576px) {
      .header h2 {
        font-size: 1.6rem;
      }

      .logo-text h1 {
        font-size: 1.5rem;
      }

      .logo {
        flex-direction: column;
        gap: 10px;
      }

      .section-title {
        font-size: 1.3rem;
        flex-direction: column;
        align-items: flex-start;
        gap: 5px;
      }

      .contact-box {
        padding: 20px;
      }

      .contact-box .email {
        font-size: 1.1rem;
        padding: 8px 16px;
      }

    }

    .legal-document {
      color: #475569;
      line-height: 1.85;
      word-break: keep-all;
      overflow-wrap: break-word;
    }

    .legal-document > p,
    .legal-document blockquote,
    .legal-document li {
      margin-bottom: 14px;
    }

    .legal-document h1 {
      color: #8b5cf6;
      font-size: 1.8rem;
      margin: 46px 0 22px;
      padding-bottom: 10px;
      border-bottom: 2px solid #8b5cf6;
    }

    .legal-document h1:first-child {
      margin-top: 0;
    }

    .legal-document h2 {
      color: #334155;
      font-size: 1.4rem;
      margin: 32px 0 16px;
    }

    .legal-document h3 {
      color: #475569;
      font-size: 1.15rem;
      margin: 24px 0 12px;
    }

    .legal-document ul,
    .legal-document ol {
      margin: 16px 0 22px 30px;
    }

    .legal-document strong {
      color: #334155;
    }

    .legal-document p:has(> strong:only-child) {
      margin: 42px 0 20px;
      padding: 12px 16px;
      color: #8b5cf6;
      font-size: 1.45rem;
      border-left: 4px solid #8b5cf6;
      background: rgba(139, 92, 246, 0.06);
      border-radius: 0 10px 10px 0;
    }

    .legal-document p > strong:first-child:not(:only-child) {
      color: #7c3aed;
      font-size: 1.08rem;
    }

    .legal-document table {
      width: 100%;
      margin: 24px 0;
      border-collapse: collapse;
      display: block;
      overflow-x: auto;
      font-size: 0.94rem;
    }

    .legal-document th,
    .legal-document td {
      min-width: 130px;
      padding: 12px 14px;
      border: 1px solid #cbd5e1;
      text-align: left;
      vertical-align: top;
    }

    .legal-document th {
      color: #334155;
      background: #f1f5f9;
      font-weight: 700;
    }

    .legal-document blockquote {
      margin: 20px 0;
      padding: 16px 20px;
      color: #475569;
      background: #f8fafc;
      border-left: 4px solid #8b5cf6;
    }

    .legal-document img {
      display: block;
      max-width: 100%;
      height: auto;
      margin: 20px auto;
    }

    .legal-document u {
      text-decoration-thickness: 1px;
      text-underline-offset: 3px;
    }

    @media (max-width: 768px) {
      .legal-document h1 {
        font-size: 1.5rem;
      }

      .legal-document h2 {
        font-size: 1.25rem;
      }

      .legal-document p:has(> strong:only-child) {
        font-size: 1.25rem;
      }
    }