* { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      background: #1a1b26;
      color: #c0caf5;
      min-height: 100vh;
      padding: 2rem 1rem;
    }
    .container { max-width: 480px; margin: 0 auto; }
    h1 { color: #c0caf5; font-size: 1.5rem; margin-bottom: 0.5rem; }
    h2 { color: #c0caf5; font-size: 1.1rem; margin-bottom: 0.75rem; }
    p { font-size: 0.9rem; color: #a9b1d6; line-height: 1.5; margin-bottom: 1rem; }
    hr { border-top: 1px solid #292e42; margin: 2rem 0; border-bottom: none; }
    label { display: block; margin-bottom: 0.4rem; font-size: 0.9rem; color: #a9b1d6; }
    input[type="text"] {
      font-family: "Cascadia Code", "MesloLGS NF", "Fira Code", monospace;
      font-size: 1.4rem;
      font-weight: 600;
      color: #c0caf5;
      background: #1e2030;
      border: 1px solid #292e42;
      border-radius: 4px;
      padding: 0.6rem 1rem;
      width: 100%;
      letter-spacing: 0.1em;
      text-align: center;
      margin-bottom: 1rem;
    }
    input[type="text"]:focus { outline: none; border-color: #7aa2f7; }
    input[type="text"]::placeholder { color: #414868; }
    button {
      padding: 0.75rem 1.2rem;
      background: #7aa2f7;
      border: none;
      border-radius: 4px;
      color: #1a1b26;
      font-size: 1rem;
      font-weight: 600;
      cursor: pointer;
      width: 100%;
    }
    button:hover { background: #89b4fa; }
    .hint { color: #565f89; font-style: italic; font-size: 0.9rem; margin-top: 1rem; }