:root {
      --bg: #ffffff;
      --text: #0f172a;
      --muted: #475569;
      --line: #e2e8f0;
      --accent: #0f172a;
    }

    * { box-sizing: border-box; }

    body {
      margin: 0;
      font-family: "IBM Plex Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      background: var(--bg);
      color: var(--text);
    }

    .page {
      min-height: 100vh;
      display: flex;
      flex-direction: column;
    }

    header {
      padding: 32px 48px;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .logo img{
        height:30px;
        color: var(--muted);
    }

    .status {
      font-size: 13px;
      color: var(--muted);
    }

    main {
      flex: 1;
      display: flex;
      align-items: center;
      padding: 0 48px;
    }

    .content {
      max-width: 820px;
    }

    h1 {
      font-size: 52px;
      line-height: 1.05;
      letter-spacing: -0.03em;
      margin: 0 0 24px;
    }

    p {
      font-size: 20px;
      line-height: 1.6;
      color: var(--muted);
      margin: 0 0 40px;
      max-width: 720px;
    }

    .divider {
      height: 1px;
      width: 100%;
      background: var(--line);
      margin: 48px 0;
    }

    .meta {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 24px;
    }

    .meta div {
      font-size: 15px;
      line-height: 1.5;
      color: var(--muted);
    }

    .meta strong {
      display: block;
      color: var(--text);
      font-weight: 500;
      margin-bottom: 6px;
    }

    footer {
      padding: 32px 48px;
      margin-top: 48px;
      border-top: 1px solid var(--line);
      display: flex;
      justify-content: space-between;
      align-items: center;
      font-size: 14px;
      color: var(--muted);
    }

    a {
      color: var(--text);
      text-decoration: none;
    }

    @media (max-width: 768px) {
      header, footer, main { padding: 24px; }
      h1 { font-size: 40px; }
      p { font-size: 18px; }
    }