:root {
      color-scheme: light;
      --blue: #2f6bff;
      --ink: #0f172a;
      --text: #334155;
      --muted: #64748b;
      --border: #e7edf8;
      --bg: #f8f9ff;
    }

    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      background: var(--bg);
      color: var(--text);
      font-family: Arial, Helvetica, sans-serif;
      line-height: 1.55;
    }

    main {
      width: min(920px, calc(100% - 32px));
      margin: 0 auto;
      padding: 42px 0 64px;
    }

    .card {
      background: #fff;
      border: 1px solid var(--border);
      border-radius: 18px;
      box-shadow: 0 12px 32px rgba(15, 23, 42, .08);
      padding: clamp(24px, 5vw, 46px);
    }

    .brand {
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 24px;
    }

    .brand img {
      width: 54px;
      height: 54px;
      object-fit: contain;
    }

    h1, h2 {
      color: var(--ink);
      line-height: 1.15;
    }

    h1 {
      margin: 0 0 12px;
      font-size: clamp(30px, 5vw, 46px);
    }

    h2 {
      margin: 32px 0 12px;
      font-size: 22px;
    }

    p {
      margin: 0 0 14px;
    }

    ul, ol {
      padding-left: 22px;
      margin: 0 0 14px;
    }

    li {
      margin: 8px 0;
    }

    a {
      color: var(--blue);
      font-weight: 700;
    }

    .note {
      background: #eef4ff;
      border: 1px solid #d8e4ff;
      border-radius: 14px;
      padding: 16px;
      margin-top: 18px;
    }