:root {
      --bg: #f6f8f7;
      --card: #ffffff;
      --text: #132033;
      --muted: #667085;
      --line: #e4e8ee;
      --green: #12864f;
      --green-soft: #eaf7ef;
      --shadow: 0 18px 48px rgba(17, 24, 39, 0.08);
      --radius: 7px;
      font-family: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", system-ui, sans-serif;
    }

    * {
      box-sizing: border-box;
    }

    body {
      margin: 0;
      min-height: 100svh;
      display: grid;
      place-items: center;
      background: var(--bg);
      color: var(--text);
      padding: 24px;
    }

    main {
      width: min(100%, 440px);
      background: var(--card);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      box-shadow: var(--shadow);
      padding: 28px;
      text-align: center;
    }

    h1 {
      margin: 0;
      font-size: 34px;
      line-height: 1.1;
      letter-spacing: 0;
    }

    .landing-logo {
      width: 76px;
      height: 76px;
      object-fit: contain;
      display: block;
      margin: 0 auto 16px;
      border-radius: 0;
      background: transparent;
    }

    h1 span {
      color: var(--green);
    }

    p {
      margin: 10px 0 24px;
      color: var(--muted);
      line-height: 1.5;
    }

    .actions {
      display: grid;
      gap: 12px;
    }

    a {
      min-height: 56px;
      border-radius: var(--radius);
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--text);
      text-decoration: none;
      font-size: 16px;
      font-weight: 800;
      transition: transform 180ms cubic-bezier(0.25, 1, 0.5, 1), box-shadow 180ms cubic-bezier(0.25, 1, 0.5, 1), background-color 180ms cubic-bezier(0.25, 1, 0.5, 1);
    }

    .admin {
      background: var(--green);
      color: #fbfffc;
      box-shadow: 0 12px 28px rgba(18, 134, 79, 0.2);
    }

    .employee {
      background: var(--green-soft);
      border: 1px solid rgba(18, 134, 79, 0.22);
      color: var(--green);
    }

    a:hover,
    a:focus-visible {
      transform: translateY(-1px);
      outline: none;
    }

    .legal-links {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 7px 12px;
      margin-top: 20px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.45;
    }

    .legal-links a {
      min-height: 0;
      display: inline;
      color: var(--green);
      font-size: inherit;
      font-weight: 700;
      text-decoration: none;
      transition: none;
    }

    .legal-links a:hover,
    .legal-links a:focus-visible {
      transform: none;
      text-decoration: underline;
    }

    footer {
      margin-top: 14px;
      color: var(--muted);
      font-size: 12px;
      line-height: 1.4;
    }